<template>
  <div style="margin-bottom: 40px">
    <div class="charging_rules">
      <el-form
        ref="ruleForm"
        :model="formdata"
        :inline="true"
        label-width="150px"
        :disabled="disabledType"
        :rules="formrule"
        label-position="top"
      >
        <div
          style="
            height: 50%;
            background: #ffffff;
            margin: 10px 10px 10px 10px;
            padding: 20px;
            border-radius: 10px;
          "
        >
          <div class="rule_title">
            <span class="title-l">
              <i class="icon_left"></i>{{ titleTip }}
              <span
                v-if="TypeList == 2"
                style="margin: 0px 0px 0px 20px; color: #f1a357"
                >{{ formdata.status_name }}</span
              >
            </span>
          </div>
          <!-- 创建 编辑 -->
          <el-row
            :gutter="24"
            v-if="TypeList == 0 || TypeList == 1"
            class="receiptManageadd_form_creation"
          >
            <el-col :span="24">
              <el-form-item label="申请原因" prop="apply_reason">
                <el-input
                  type="textarea"
                  :rows="1"
                  v-model="formdata.apply_reason"
                  style="width: 582%"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8" style="height: 66px">
              <el-form-item label="报销类型" prop="reimburse_type">
                <el-select
                  v-model="formdata.reimburse_type"
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in accountType"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              v-if="TypeList == 1 || TypeList == 2"
              style="height: 66px"
            >
              <el-form-item label="申请单号" prop="apply_no">
                <span>{{ formdata.apply_no }}</span>
                <span
                  style="
                    color: #4200ff;
                    margin: 0px 0px 0px 10px;
                    cursor: pointer;
                  "
                  @click="diagnosis()"
                  v-if="formdata.relation_type == '3'"
                  >诊断</span
                >
              </el-form-item>
            </el-col>
            <el-col :span="8" style="height: 66px">
              <el-form-item label="关联对象类型" prop="relation_type">
                <el-select
                v-model="formdata.relation_type"
                filterable
                placeholder="请选择"
                @change="formdatatyep()"
              >
                <el-option
                  v-for="item in waycategoryList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
                <!-- <el-select
                  v-if="formdata.reimburse_type == '1'"
                  v-model="formdata.relation_type"
                  filterable
                  placeholder="请选择"
                  @change="formdatatyep()"
                >
                  <el-option
                    v-for="item in waycategoryList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
                <el-select
                  v-else
                  v-model="formdata.relation_type"
                  filterable
                  placeholder="请选择"
                  @change="formdatatyep()"
                >
                  <el-option
                    v-for="item in categoryList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select> -->
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              v-if="formdata.relation_type != 2"
              style="height: 66px"
            >
            <el-form-item label="关联对象" v-if="formdata.relation_type == '3'"  >
              <el-button
                plain
                @click="pleaseChoose()"
                >请选择</el-button
              >
              <span v-if="formdata.relation_type == 0">
                <span style="margin: 0px 0px 0px 10px;color: blue; cursor: pointer" @click="customDiagosis()"  v-if="TypeList == 1 || TypeList == 2">诊断</span>
              </span>
        
            </el-form-item>
            <el-form-item label="关联对象"  prop="relation_id" v-else >
              <el-select
                v-model="formdata.relation_id"
                filterable
                placeholder="请选择"
              >
                <el-option
                  v-for="item in relevanceObj"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
              <span v-if="formdata.relation_type == 0">
                <span style="margin: 0px 0px 0px 10px;color: blue; cursor: pointer" @click="customDiagosis()"  v-if="TypeList == 1 || TypeList == 2">诊断</span>
              </span>
            </el-form-item>
              <!-- <el-form-item label="关联对象"  prop="relation_id"  >
                <el-button
                  plain
                  v-if="formdata.relation_type == '3'"
                  @click="pleaseChoose()"
                  >请选择</el-button
                >
                <el-select
                  v-else
                  v-model="formdata.relation_id"
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in relevanceObj"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
                <span style="margin: 0px 0px 0px 10px;color: blue; cursor: pointer" @click="customDiagosis()"  v-if="TypeList == 1 || TypeList == 2">诊断</span>
              </el-form-item> -->
            </el-col>
            <el-col :span="8" style="height: 66px">
              <el-form-item label="报销主体" prop="company_invoice_body_id">
                <el-select
                  v-model="formdata.company_invoice_body_id"
                  filterable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in InvoiceBookList"
                    :key="item.id"
                    :label="item.invoice_body_name"
                    :value="item.id + ''"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="是否冲销备用金">
                <el-radio v-model="formdata.is_used_petty_cash" label="0"
                  >否</el-radio
                >
                <el-radio v-model="formdata.is_used_petty_cash" label="1"
                  >是</el-radio
                >
              </el-form-item>
            </el-col>
            <!--当是否冲销备 是 -->
            <el-col :span="8" v-if="formdata.is_used_petty_cash == 1">
              <el-form-item label="备用金账号" prop="petty_cash_id">
                <el-select
                  v-model="formdata.petty_cash_id"
                  placeholder="请输入备用金账号名称"
                  @change="SelectedData"
                >
                  <el-option
                    v-for="item in optionsList"
                    :key="item.id"
                    :label="item.invoice_body_name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="formdata.is_used_petty_cash == 1">
              <el-form-item label="备用金余额">
                <el-input
                  v-model="imprestFund"
                  disabled
                  placeholder="请输入"
                  style="width: 109%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="formdata.is_used_petty_cash == 1">
              <el-form-item label="冲抵备用金" prop="charge_off_money">
                <el-input
                  v-model="formdata.charge_off_money"
                  placeholder="请输入"
                  type="number"
                  style="width: 109%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="实际报销金额">
                <el-input
                  v-model="actualAmount"
                  :disabled="true"
                  @click.stop.native
                  placeholder="请输入"
                  style="width: 109%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="费用明细汇总">
                <el-input
                  v-model="collectMoeny"
                  :disabled="true"
                  @click.stop.native
                  placeholder="请输入"
                  style="width: 109%"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="usernameflase == false">
              <el-form-item label="收款人" prop="payee">
                <el-select
                  filterable
                  remote
                  reserve-keyword
                  :remote-method="searchCustomerList"
                  v-model="formdata.payee"
                  @change="selectedCustomer"
                  style="width: 100%"
                >
                  <el-option
                    v-for="item in clientList"
                    :key="item.id"
                    :label="item.invoice_body_name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="usernameflase == false">
              <el-form-item label="收款人银行" prop="receive_bank">
                <el-input
                  v-model="formdata.receive_bank"
                  @click.stop.native
                  placeholder="请输入"
                  style="width: 109%"
                />
              </el-form-item>
            </el-col>

            <el-col :span="8" v-if="usernameflase == false">
              <el-form-item label="收款人银行账号" prop="receive_account">
                <el-input
                  v-model="formdata.receive_account"
                  @click.stop.native
                  placeholder="请输入"
                  style="width: 109%"
                />
              </el-form-item>
            </el-col>
            <el-form-item label="附件">
              <UploadLink :files.sync="formdata.appendix"></UploadLink>
            </el-form-item>
            <el-col :span="8" v-if="TypeList == 2" style="height: 103px">
              <el-form-item label="申请人">
                <span>{{ formdata.creator }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="TypeList == 2">
              <el-form-item label="申请时间">
                <span v-time="formdata.create_time"></span>
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 详情 -->
          <el-row v-else class="receiptManageadd_form_details">
            <el-col :span="24">
              <el-form-item label="申请原因" prop="apply_reason">
                <el-input
                  type="textarea"
                  :rows="1"
                  v-model="formdata.apply_reason"
                  style="width: 582%"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8" class="row_height_of">
              <el-form-item label="报销类型" prop="reimburse_type">
                <span>{{ formdata.reimburse_type_name }}</span>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              v-if="TypeList == 1 || TypeList == 2"
              class="row_height_of"
            >
              <el-form-item label="申请单号" prop="apply_no">
                <span>{{ formdata.apply_no }}</span>
                <span
                  style="
                    color: #4200ff;
                    margin: 0px 0px 0px 10px;
                    cursor: pointer;
                  "
                  @click="diagnosis()"
                  v-if="formdata.relation_type == '3'"
                  >诊断</span
                >
              </el-form-item>
            </el-col>
            <el-col :span="8" class="row_height_of">
              <el-form-item label="关联对象类型">
                <span>{{ formdata.relation_type_name }}</span>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              v-if="formdata.relation_type != 2"
              class="row_height_of"
            >
              <el-form-item label="关联对象">
                <span>{{ formdata.relation_name }}</span>
                <span v-if="formdata.relation_type == 0">
                  <span style="margin: 0px 0px 0px 10px;color: blue; cursor: pointer" @click="customDiagosis()"  v-if="TypeList == 1 || TypeList == 2">诊断</span>
                </span>
              </el-form-item>
            </el-col>
            <el-col :span="8" class="row_height_of">
              <el-form-item label="报销主体">
                <span>{{ formdata.company_invoice_body_id_name }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" class="row_height_of">
              <el-form-item label="是否冲销备用金">
                <span>{{ formdata.is_used_petty_cash_name }}</span>
              </el-form-item>
            </el-col>
            <!--当是否冲销备 是 -->
            <el-col
              :span="8"
              v-if="formdata.is_used_petty_cash == 1"
              class="row_height_of"
            >
              <el-form-item label="备用金账号" prop="petty_cash_id">
                <span>{{ formdata.petty_cash_id_name }}</span>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              v-if="formdata.is_used_petty_cash == 1"
              class="row_height_of"
            >
              <el-form-item label="备用金余额">
                <span>{{ formdata.petty_cash_balance }}</span>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              v-if="formdata.is_used_petty_cash == 1"
              class="row_height_of"
            >
              <el-form-item label="冲抵备用金" prop="charge_off_money">
                <span>{{ formdata.charge_off_money }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" class="row_height_of">
              <el-form-item label="实际报销金额">
                <span>{{ actualAmount }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" class="row_height_of">
              <el-form-item label="费用明细汇总">
                <span>{{ collectMoeny }}</span>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              class="row_height_of"
              v-if="usernameflase == false"
            >
              <el-form-item label="收款人" prop="payee">
                <span>{{ formdata.payee }}</span>
              </el-form-item>
            </el-col>
            <el-col
              :span="8"
              class="row_height_of"
              v-if="usernameflase == false"
            >
              <el-form-item label="收款人银行" prop="receive_bank">
                <span>{{ formdata.receive_bank }}</span>
              </el-form-item>
            </el-col>

            <el-col
              :span="8"
              class="row_height_of"
              v-if="usernameflase == false"
            >
              <el-form-item label="收款人银行账号" prop="receive_account">
                <span>{{ formdata.receive_account }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="TypeList == 2" class="row_height_of">
              <el-form-item label="申请人">
                <span>{{ formdata.creator }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="8" v-if="TypeList == 2" class="row_height_of">
              <el-form-item label="申请时间">
                <span v-time="formdata.create_time"></span>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="附件">
                <UploadLink :files.sync="formdata.appendix"></UploadLink>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <div
          style="
            height: 50%;
            background: #ffffff;
            margin: 10px 10px 10px 10px;
            padding: 20px;
            border-radius: 10px;
          "
        >
          <el-row :gutter="24">
            <div style="margin: 0px 0px 10px 10px" v-if="this.TypeList != 2">
              <el-button
                plain
                type="primary"
                v-if="formdata.relation_type == '3'"
                @click="pleaseChoose()"
                >新增</el-button
              >
              <el-button v-else type="primary" plain @click="reimbureadd()"
                >新增</el-button
              >
              <el-button
                plain
                type="primary"
                v-if="formdata.relation_type == '3'"
                @click="removeChoose()"
                >删除</el-button
              >
              <el-button v-else type="primary" plain @click="reimburedelet()"
                >删除</el-button
              >
            </div>
          </el-row>
          <el-row :gutter="24">
            <div v-if="formdata.relation_type == '3'" key="001">
              <el-button
                v-if="TypeList == 2"
                type="primary"
                :disabled="false"
                style="margin: 0px 0px 10px 0px"
                @click="exportFirst()"
                >导出</el-button
              >
              <el-table
                :data="spanValcheckedRows"
                :span-method="objectSpanMethodspan"
                border
                @selection-change="totalmemClassname"
              >
                <el-table-column type="selection" width="45"> </el-table-column>
                <el-table-column prop="relation_no" label="批次号">
                </el-table-column>
                <el-table-column prop="node_type" label="批次类型">
                  <template slot-scope="scope">
                    <span>{{ scope.row.node_type | afterTime }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="create_time" label="承运开始时间">
                  <template slot-scope="scope">
                    {{
                      new Date(Number(scope.row.create_time) * 1000)
                        .toLocaleString()
                        .replace(/:\d{1,2}$/, " ")
                    }}
                  </template>
                </el-table-column>
                <el-table-column prop="carrier_name" label="承运商">
                </el-table-column>
                <el-table-column prop="total_expenses" label="金额(元)">
                </el-table-column>
                <!-- <el-table-column label="附件">
                  <template slot-scope="scope">
                    <el-upload
                      class="upload-demo"
                      action
                      multiple
                      :auto-upload="false"
                      :on-change="
                        (file, fileList) => {
                          handleChangeTwo(file, fileList, scope.$index);
                        }
                      "
                      :on-remove="
                        (file, fileList) => {
                          removeChangeTwo(file, fileList, scope.$index);
                        }
                      "
                      :file-list="
                        (
                          spanValcheckedRows[scope.$index].carry_all_data[0] ||
                          {}
                        ).enclosure_list
                      "
                    >
                      <el-button size="small" type="text">点击上传</el-button>
                      <div slot="file" slot-scope="{ file }">
                        <li class="el-upload-list__item is-success">
                          <a
                            @click="() => openUrl(file)"
                            class="el-upload-list__item-name"
                          >
                            <i class="el-icon-document"></i>{{ file.name }}
                          </a>
                          <label class="el-upload-list__item-status-label">
                            <i
                              class="el-icon-upload-success el-icon-circle-check"
                            ></i>
                          </label>
                          <i
                            @click.stop="removeChangeTwo(file, scope.$index)"
                            class="el-icon-close"
                            :disabled="disabledType"
                          ></i>
                        </li>
                      </div>
                    </el-upload>
                  </template>
                </el-table-column> -->
                <el-table-column prop="waybill_no" label="运单号">
                  <template slot-scope="scope">
                    <div
                      style="cursor: pointer; color: blue"
                      @click="handleJump(scope)"
                    >
                      {{ scope.row.waybill_no }}
                    </div>
                  </template>
                </el-table-column>
                <el-table-column prop="waybill_product_type" label="承运类型">
                </el-table-column>
                <el-table-column
                  prop="package_type_name"
                  label="包装型号"
                  width="100"
                >
                </el-table-column>
                <el-table-column prop="number" label="件数"> </el-table-column>
                <el-table-column prop="weight" label="重量"> </el-table-column>
                <el-table-column prop="volume" label="体积"> </el-table-column>
                <el-table-column prop="package_quantity" label="包装数量">
                </el-table-column>
              </el-table>
            </div>
            <div v-if="formdata.relation_type != '3'" key="002">
              <el-table
                :data="formdata.expenditure_list"
                style="width: 100%; margin: 0px 0px 0px 10px"
                :row-class-name="tableRowClassName"
                @selection-change="reimbureaddchange"
              >
                <el-table-column type="selection" width="55"> </el-table-column>
                <el-table-column prop="fee_id" label="费项" width="180">
                  <template slot-scope="scope">
                    <!-- <el-select v-model="scope.row.fee_id" filterable placeholder="请选择"
                      @change="handleFeeChange(scope.row)">
                      <el-option v-for="item in travelExpenseList" :key="item.id" :label="item.name" :value="item.id">
                      </el-option>
                    </el-select> -->
                    <el-form-item
                      :prop="'expenditure_list.' + scope.$index + '.fee_id'"
                      :rules="formrule.fee_id"
                      style="padding: 15px 0px 0px 0px"
                    >
                      <el-select
                        v-model="scope.row.fee_id"
                        filterable
                        placeholder="请选择"
                        @change="handleFeeChange(scope.row)"
                      >
                        <el-option
                          v-for="item in travelExpenseList"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id"
                        >
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="fee_detail" label="费项明细" width="180">
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.fee_detail"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="date" label="日期" width="210">
                  <template slot-scope="scope">
                    <!-- <el-date-picker v-model="scope.row.date" style="width:185px" @change="handleFeeChange(scope.row)"
                      value-format="timestamp" type="month" placeholder="选择月">
                    </el-date-picker> -->
                    <el-form-item
                      :prop="'expenditure_list.' + scope.$index + '.date'"
                      :rules="formrule.date"
                      style="padding: 15px 0px 0px 0px"
                    >
                      <el-date-picker
                        v-model="scope.row.date"
                        style="width: 185px"
                        @change="handleFeeChange(scope.row)"
                        value-format="timestamp"
                        type="month"
                        placeholder="选择月"
                      >
                      </el-date-picker>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="money" label="金额" width="180">
                  <template slot-scope="scope">
                    <!-- <el-input v-model="scope.row.money" type="number" key="001"></el-input> -->
                    <el-form-item
                      :prop="'expenditure_list.' + scope.$index + '.money'"
                      style="padding: 15px 0px 0px 0px"
                      :rules="formrule.money"
                    >
                      <el-input
                        v-model="scope.row.money"
                        type="number"
                        key="001"
                      ></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="上传附件" min-width="300">
                  <template slot-scope="scope">
                    <UploadLink
                      :files.sync="scope.row.enclosure_list"
                    ></UploadLink>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-row>
        </div>
        <div
          style="
            height: 50%;
            width: 50%;
            background: #ffffff;
            margin: 10px 10px 10px 10px;
            padding: 20px;
            border-radius: 10px;
          "
        >
          <el-form-item label="分摊方式" label-width="80px">
            <el-select
              filterable
              v-model="formdata.share_type"
              placeholder="分摊方式"
            >
              <el-option
                v-for="item in share_option"
                :key="item.value"
                :label="item.label"
                :value="item.value + ''"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-table
            :data="formdata.share"
            border
            style="width: 100%"
            v-if="formdata.share != ''"
          >
            <el-table-column type="index" width="40">
              <template slot="header" slot-scope="scope">
                <span
                  @click="addShiper(scope)"
                  style="font-size: 20px; text-align: center"
                  >+</span
                >
              </template>
              <template slot-scope="scope">
                <div class="remodername">
                  <div class="number">{{ scope.$index + 1 }}</div>
                  <div
                    class="remodercenter el-icon-minus"
                    @click="reduce(scope.$index)"
                  ></div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="分摊部门">
              <template slot="header">
                <span style="color: red">*分摊部门</span>
              </template>
              <template slot-scope="scope">
                <el-form-item
                  :prop="'share.' + scope.$index + '.share_branch_id'"
                  :rules="formrule.share_branch_id"
                >
                  <el-select
                    filterable
                    v-model="scope.row.share_branch_id"
                    placeholder="请选择分摊部门"
                    style="margin-top: 18px"
                  >
                    <el-option
                      v-for="item in reqWebsiteData"
                      :key="item.id"
                      :label="item.branch_name"
                      :value="item.id + ''"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column
              label="按比例分摊(%)"
              v-if="formdata.share_type == 1"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.share_content"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="按金额分摊(元)"
              v-if="formdata.share_type == 0"
            >
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.share_content"
                  type="number"
                ></el-input>
              </template>
            </el-table-column>
          </el-table>
        </div>

        <div class="footerType">
          <div style="text-align: center; margin: 5px 0px 5px 0px">
            <el-row :gutter="24" v-if="Tabs == 3 || Tabs == 4">
              <div>
                <el-button
                  @click="AuditCancellation()"
                  type="primary"
                  :disabled="false"
                  plain
                  >关闭</el-button
                >
                <el-button
                  @click="PassAudit(1)"
                  type="primary"
                  v-if="
                    Tabs == 3 && AuditDetails.is_current_user_can_approve == 1
                  "
                  plain
                  :disabled="false"
                  >通过</el-button
                >

                <el-button
                  @click="PassAudit(2)"
                  type="primary"
                  v-if="
                    Tabs == 3 && AuditDetails.is_current_user_can_approve == 1
                  "
                  plain
                  :disabled="false"
                  >驳回</el-button
                >
                <el-button
                  @click="PassAuditturn()"
                  type="primary"
                  v-if="
                    Tabs == 3 && AuditDetails.is_current_user_can_approve == 1
                  "
                  plain
                  :disabled="false"
                  style="margin: 0px 10px 0px 0px"
                  >转办</el-button
                >
                <el-button
                  v-if="
                    (localgetdata.user_id == formdata.creator_id ||
                      localgetdata.user_id == 1) &&
                    (formdata.status == 1 || formdata.status == 2)
                  "
                  type="primary"
                  :disabled="false"
                  plain
                  @click="approvaldata()"
                  >撤回</el-button
                >
                <el-button
                  @click="derivedDataItem()"
                  style="margin: 0px 0px 0px 10px"
                  v-if="
                    formdata.status == 1 ||
                    formdata.status == 3 ||
                    formdata.status == 2
                  "
                  :disabled="false"
                  type="primary"
                  plain
                  >导出</el-button
                >
                <el-dropdown
                  :disabled="false"
                  style="margin: 0px 0px 0px 10px"
                  v-if="Tabs != 0"
                >
                  <el-button type="primary" plain :disabled="false">
                    更多<i class="el-icon-arrow-down el-icon--right"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown" :append-to-body="false">
                    <el-dropdown-item
                      style="width: 70px; text-align: center"
                      v-if="
                        formdata.status == 1 &&
                        localgetdata.user_id == formdata.creator_id
                      "
                    >
                      <div style="width: 70px" @click="pressab()">催办</div>
                      <!-- <el-button type="primary"
                        v-if=" formdata.status == 1 && localgetdata.user_id==  formdata.creator_id " plain
                        @click="pressab()" :disabled='false'>催办</el-button> -->
                    </el-dropdown-item>
                    <el-dropdown-item
                      style="width: 70px; text-align: center"
                      v-if="
                        formdata.status == 1 ||
                        formdata.status == 2 ||
                        formdata.status == 3
                      "
                    >
                      <div style="width: 70px" @click="AddComment()">评论</div>
                      <!-- <el-button @click="AddComment()" type="primary"
                        v-if="formdata.status == 1 || formdata.status == 2 || formdata.status == 3" plain
                        :disabled='false'>评论</el-button> -->
                    </el-dropdown-item>
                    <el-dropdown-item
                      style="width: 70px; text-align: center"
                      v-if="formdata.status == 1"
                    >
                      <div style="width: 70px" @click="reapplyPay()">
                        再次申请
                      </div>
                      <!-- <el-button @click="reapplyPay()" :disabled='false' v-if="formdata.status == 1" type="primary"
                        plain>再次申请</el-button> -->
                    </el-dropdown-item>
                    <!-- <el-dropdown-item style="width: 50px;text-align: center;" v-if="formdata.status==1 || formdata.status==3 || formdata.status==2 " >
                      <span @click="derivedDataItem()">导出</span>
                     
                    </el-dropdown-item> -->
                  </el-dropdown-menu>
                </el-dropdown>
              </div>
            </el-row>
            <el-row :gutter="24" v-else>
              <div>
                <el-button
                  type="primary"
                  plain
                  @click="presercancel()"
                  :disabled="false"
                  style="margin: 0px 10px 0px 0px"
                  >取消</el-button
                >
                <span v-if="TypeList == 0">
                  <el-button
                    type="primary"
                    plain
                    @click="preserveadd('ruleForm', '0')"
                    >保存</el-button
                  >
                  <el-button
                    type="primary"
                    plain
                    @click="preserveadd('ruleForm', '1')"
                    >发起审批</el-button
                  >
                </span>
                <span v-if="TypeList == 1 && Tabs == 0">
                  <el-button
                    type="primary"
                    plain
                    @click="preserveEdit('ruleForm', '0')"
                    >保存</el-button
                  >
                  <el-button
                    type="primary"
                    plain
                    @click="preserveEdit('ruleForm', '1')"
                    >发起审批</el-button
                  >
                </span>
                <span
                  style="margin-right: 10px"
                  v-if="AuditDetails.is_current_user_can_approve == 1"
                >
                  <el-button
                    @click="PassAudit(1)"
                    type="primary"
                    v-if="AuditDetails.is_current_user_can_approve == 1"
                    plain
                    :disabled="false"
                    >通过</el-button
                  >
                  <el-button
                    @click="PassAudit(2)"
                    type="primary"
                    v-if="AuditDetails.is_current_user_can_approve == 1"
                    plain
                    :disabled="false"
                    >驳回</el-button
                  ></span
                >
                <el-button
                  @click="PassAuditturn()"
                  type="primary"
                  v-if="AuditDetails.is_current_user_can_approve == 1"
                  plain
                  :disabled="false"
                  style="margin: 0px 10px 0px 0px"
                  >转办</el-button
                >
                <span
                  v-if="
                    (localgetdata.user_id == formdata.creator_id ||
                      localgetdata.user_id == 1) &&
                    (formdata.status == 1 || formdata.status == 2)
                  "
                >
                  <el-button
                    type="primary"
                    :disabled="false"
                    plain
                    @click="approvaldata()"
                    >撤回</el-button
                  >
                </span>
                <span
                  v-if="
                    formdata.status == 1 ||
                    formdata.status == 2 ||
                    formdata.status == 3
                  "
                  style="margin: 0px 0px 0px 10px"
                >
                  <el-button
                    type="primary"
                    :disabled="false"
                    plain
                    @click="derivedDataItem()"
                    >导出</el-button
                  >
                </span>
                <el-dropdown
                  :disabled="false"
                  style="margin: 0px 0px 0px 10px"
                  v-if="Tabs != 0"
                >
                  <el-button type="primary" plain :disabled="false">
                    更多<i class="el-icon-arrow-down el-icon--right"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown" :append-to-body="false">
                    <el-dropdown-item
                      style="width: 70px; text-align: center"
                      v-if="
                        formdata.status == 1 &&
                        localgetdata.user_id == formdata.creator_id
                      "
                    >
                      <div style="width: 70px" @click="pressab()">催办</div>
                      <!-- <el-button type="primary"
                        v-if=" formdata.status == 1 && localgetdata.user_id==  formdata.creator_id " plain
                        @click="pressab()" :disabled='false' style="margin: 0px 10px 0px 0px;">催办</el-button> -->
                    </el-dropdown-item>
                    <!-- <el-dropdown-item style="width: 50px;text-align: center;"
                      v-if="formdata.status == 1 || formdata.status == 2 || formdata.status == 3">
                      <span @click="derivedDataItem()">导出</span>

                    </el-dropdown-item> -->
                    <el-dropdown-item
                      style="width: 70px; text-align: center"
                      v-if="
                        formdata.status == 1 ||
                        formdata.status == 3 ||
                        formdata.status == 2
                      "
                    >
                      <div style="width: 70px" @click="AddComment()">评论</div>
                      <!-- <span v-if="formdata.status==1 || formdata.status==3 || formdata.status==2"
                        style="margin-right:10px;">
                        <el-button @click="AddComment()" :disabled='false' type="primary" plain>评论</el-button>
                      </span> -->
                    </el-dropdown-item>
                    <el-dropdown-item
                      style="width: 70px; text-align: center"
                      v-if="formdata.status == 1"
                    >
                      <div style="width: 70px" @click="reapplyPay()">
                        再次申请
                      </div>
                      <!-- <el-button @click="reapplyPay()" :disabled='false' v-if="formdata.status == 1" type="primary"
                        plain>再次申请</el-button> -->
                    </el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </div>
            </el-row>
          </div>
        </div>
      </el-form>
      <el-dialog
        title="选择关联费项"
        :visible.sync="dialogFormVisible"
        width="90%"
      >
        <!-- 调整批次单金额的弹出框 -->
        <el-dialog
          title="调整批次单金额"
          width="800px"
          :visible.sync="changeWaybillFees"
          append-to-body
        >
          <el-table
            v-if="tableTabe === '1'"
            ref="singleTable"
            :data="adjustWaybillFee"
            highlight-current-row
            key="1"
            style="width: 100%"
            border
          >
            <el-table-column type="selection" width="45"> </el-table-column>
            <el-table-column
              prop=""
              fixed
              label="序号"
              width="50"
              type="index"
            ></el-table-column>
            <el-table-column prop="waybill_no" label="运单号" width="180" fixed>
              <template slot-scope="scope">
                <div
                  style="cursor: pointer; color: blue"
                  @click="handleJump(scope)"
                >
                  {{ scope.row.waybill_no }}
                </div>
              </template>
            </el-table-column>
            <el-table-column
              prop="collect_money"
              label="提货揽收费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.collect_money"></el-input>
              </template>
            </el-table-column>

            <el-table-column
              prop="package_money"
              label="揽收包装费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.package_money"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="handling_money"
              label="揽收装卸费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.handling_money"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="delivery_money"
              label="揽收发货费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.delivery_money"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="airport_pick_money"
              label="揽收机场提货费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.airport_pick_money"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="dry_ice_money"
              label="揽收干冰费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.dry_ice_money"></el-input>
              </template>
            </el-table-column>
          </el-table>
          <el-table
            v-if="tableTabe === '2'"
            ref="singleTable"
            :data="adjustWaybillFee"
            highlight-current-row
            key="2"
            style="width: 100%"
            border
          >
            <el-table-column type="selection" width="45"> </el-table-column>
            <el-table-column
              prop=""
              fixed
              label="序号"
              width="50"
              type="index"
            ></el-table-column>
            <el-table-column prop="waybill_no" label="运单号" width="180" fixed>
              <template slot-scope="scope">
                <div
                  style="cursor: pointer; color: blue"
                  @click="handleJump(scope)"
                >
                  {{ scope.row.waybill_no }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="transport_fee" label="运输费" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.transport_fee"></el-input>
              </template>
            </el-table-column>
          </el-table>
          <el-table
            v-if="tableTabe === '3'"
            ref="singleTable"
            :data="adjustWaybillFee"
            highlight-current-row
            key="3"
            style="width: 100%"
            border
          >
            <el-table-column type="selection" width="45"> </el-table-column>
            <el-table-column
              prop=""
              fixed
              label="序号"
              width="50"
              type="index"
            ></el-table-column>
            <el-table-column prop="waybill_no" label="运单号" width="180" fixed>
              <template slot-scope="scope">
                <div
                  style="cursor: pointer; color: blue"
                  @click="handleJump(scope)"
                >
                  {{ scope.row.waybill_no }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="delivery_fee" label="配送费" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.delivery_fee"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="extra_distribution_fee"
              label="配送里程费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.extra_distribution_fee"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="second_distribution_fee"
              label="二次配送费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.second_distribution_fee"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="waiting_fee" label="配送专车费" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.waiting_fee"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="airport_pick_fee"
              label="配送机场提货费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.airport_pick_fee"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="dry_ice_fee" label="配送干冰费" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.dry_ice_fee"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="return_box_money" label="返箱费" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.return_box_money"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="airport_operate_fee"
              label="机场操作费"
              width="180"
            >
              <template slot-scope="scope">
                <el-input v-model="scope.row.airport_operate_fee"></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="transfer_fee" label="中转费" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.transfer_fee"></el-input>
              </template>
            </el-table-column>
          </el-table>
          <el-table
            v-if="tableTabe === '4'"
            ref="singleTable"
            :data="adjustWaybillFee"
            highlight-current-row
            key="4"
            style="width: 70%"
            border
            :span-method="arraySpanMethodType"
          >
            <el-table-column type="selection" width="45"> </el-table-column>
            <el-table-column
              prop=""
              fixed
              label="序号"
              width="50"
              type="index"
            ></el-table-column>
            <el-table-column prop="waybill_no" label="运单号" fixed>
              <template slot-scope="scope">
                <div
                  style="cursor: pointer; color: blue"
                  @click="handleJump(scope)"
                >
                  {{ scope.row.waybill_no }}
                </div>
              </template>
            </el-table-column>
            <el-table-column prop="collect_money" label="回单费用" width="180">
              <template slot-scope="scope">
                <el-input v-model="scope.row.return_receipt_fee"></el-input>
              </template>
            </el-table-column>
          </el-table>
          <el-table
            v-if="tableTabe === '5'"
            ref="singleTable"
            :data="adjustWaybillFee"
            highlight-current-row
            key="5"
            style="width: 100%"
            border
          >
            <el-table-column type="expand" width="80">
              <template slot-scope="scope">
                <el-table :data="scope.row.incubator_list">
                  <el-table-column
                    prop=""
                    fixed
                    label="序号"
                    width="50"
                    type="index"
                  ></el-table-column>
                  <el-table-column label="保温箱类型" prop="incubator_type">
                    <template slot-scope="scope">
                      <span>{{
                        scope.row.incubator_type | incuType(Package_model)
                      }}</span>
                    </template>
                  </el-table-column>
                  <el-table-column label="金额" prop="expense">
                    <template slot-scope="scope">
                      <el-input v-model="scope.row.expense"></el-input>
                    </template>
                  </el-table-column>
                </el-table>
              </template>
            </el-table-column>
            <el-table-column type="selection" width="45"> </el-table-column>
            <el-table-column
              prop=""
              fixed
              label="序号"
              width="50"
              type="index"
            ></el-table-column>
            <el-table-column prop="waybill_no" label="运单号">
              <template slot-scope="scope">
                <div
                  style="cursor: pointer; color: blue"
                  @click="handleJump(scope)"
                >
                  {{ scope.row.waybill_no }}
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div style="display: flex; margin: 10px 0px 0px 0px">
            <div style="margin: 5px 5px 0px 0px">
              <span style="color: red">*</span>
              调整原因:
            </div>
            <div>
              <el-input
                type="textarea"
                :rows="1"
                placeholder="请输入内容"
                v-model="reasonList"
                style="width: 230%"
              ></el-input>
            </div>
          </div>
          <div slot="footer" class="dialog-footer">
            <el-button @click="changeWaybillFees = false">取 消</el-button>
            <el-button type="primary" @click="saveWaybillFees">确 定</el-button>
          </div>
        </el-dialog>

        <el-form
          ref="queryDate"
          :model="queryDate"
          :inline="true"
          label-width="80px"
          label-position="right"
        >
          <el-form-item label="批次号">
            <el-input
              v-model="queryDate.relation_no"
              @click.stop.native
              style="width: 200px"
              placeholder="请输入"
            />
          </el-form-item>
          <el-form-item label="批次类型">
            <el-select
              v-model="queryDate.node_type"
              placeholder="请选择批次类型"
            >
              <el-option key="1" label="揽收" value="1"> </el-option>
              <el-option key="2" label="干线" value="2"> </el-option>
              <el-option key="3" label="配送" value="3"> </el-option>
              <el-option key="4" label="回单" value="4"> </el-option>
              <el-option key="5" label="回箱" value="5"> </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="运单号">
            <el-input
              v-model="queryDate.waybill_no"
              @click.stop.native
              style="width: 200px"
              placeholder="请输入"
            />
            <el-tooltip
              class="item"
              effect="dark"
              content="运单诊断"
              placement="top-start"
            >
              <i
                class="el-icon-thumb"
                style="font-size: 16px; margin: 0px 0px 0px 5px; color: #409eff"
                @click="waybilldiagno()"
              ></i>
            </el-tooltip>
          </el-form-item>

          <el-form-item label="承运商">
            <el-select
              v-model="queryDate.carrier_id"
              filterable
              placeholder="请选择"
              style="width: 200px"
            >
              <el-option
                v-for="item in commonCarrier"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="出发网点">
            <el-select
              v-model="queryDate.from_network_id"
              filterable
              placeholder="请选择"
              style="width: 200px"
            >
              <el-option
                id="customer"
                v-for="item in originListData"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="目的网点">
            <el-select
              v-model="queryDate.to_network_id"
              filterable
              placeholder="请选择"
              style="width: 200px"
            >
              <el-option
                id="customer"
                v-for="item in originListData"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="出发区域">
            <el-select
              style="width: 200px"
              placeholder="出发区域"
              clearable
              filterable
              v-model="queryDate.from_area_id"
            >
              <el-option
                v-for="website in websiteListDQ"
                :key="website.id"
                :label="website.name"
                :value="website.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="目的区域">
            <el-select
              style="width: 200px"
              placeholder="目的区域"
              clearable
              filterable
              v-model="queryDate.to_area_id"
            >
              <el-option
                v-for="website in websiteListDQ"
                :key="website.id"
                :label="website.name"
                :value="website.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="始发城市">
            <el-input
              v-model="queryDate.from_region"
              @click.stop.native
              style="width: 200px"
              placeholder="请输入"
            />
          </el-form-item>
          <el-form-item label="目的城市">
            <el-input
              v-model="queryDate.to_region"
              @click.stop.native
              style="width: 200px"
              placeholder="请输入"
            />
          </el-form-item>
          <el-form-item label="客户">
            <el-select
              v-model="queryDate.customer_id"
              filterable
              placeholder="请选择"
              style="width: 200px"
            >
              <el-option
                v-for="customer in customerList"
                :key="customer.id"
                :label="customer.name"
                :value="customer.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="客户所属区域" label-width="100px">
            <el-select
              v-model="queryDate.customer_area_id"
              filterable
              placeholder="请选择"
            >
              <el-option
                v-for="website in websiteList"
                :key="website.id"
                :label="website.name"
                :value="website.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="承运类型">
            <el-select
              v-model="queryDate.waybill_product_type"
              filterable
              placeholder="请选择"
              style="width: 200px"
            >
              <el-option
                id="customer"
                v-for="item in transportsType"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="运单创建时间" label-width="100px">
            <el-date-picker
              v-model="queryDate.waybill_list_create"
              type="daterange"
              value-format="timestamp"
              align="right"
              unlink-panels
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions"
              :default-time="['00:00:00', '23:59:59']"
              style="width: 200px"
            />
          </el-form-item>
          <el-form-item label="承运开始时间" label-width="100px">
            <el-date-picker
              v-model="queryDate.commencement"
              type="daterange"
              value-format="timestamp"
              align="right"
              unlink-panels
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions"
              :default-time="['00:00:00', '23:59:59']"
              style="width: 200px"
            />
          </el-form-item>
          <el-form-item label="">
            <el-button type="primary" @click="queryDateSee()">查询</el-button>
            <el-button type="primary" @click="replaCemnent()">重置</el-button>
          </el-form-item>
        </el-form>
        <el-table
          :data="spanVal"
          ref="dataTable"
          :span-method="objectSpanMethod"
          border
          @selection-change="handleSelectionChange"
          @select="selectChange"
          :row-key="getRowKeys"
          :key="itemKey"
        >
          <el-table-column
            type="selection"
            width="45"
            :reserve-selection="true"
            :selectable="isRowDisabled"
          >
          </el-table-column>
          <el-table-column prop="relation_no" label="批次号" width="180">
          </el-table-column>
          <el-table-column prop="node_type" label="批次类型" width="80">
            <template slot-scope="scope">
              <span>{{ scope.row.node_type | afterTime }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="status" label="是否可报销" width="100">
            <template slot-scope="scope">
              <span
                @click="claimpayment(scope.row)"
                style="color: #2323ff; cursor: pointer"
                v-if="scope.row.status != 0"
                >{{ scope.row.status | afterstatus }}</span
              >
              <span v-if="scope.row.status == 0">{{
                scope.row.status | afterstatus
              }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="create_time" label="承运开始时间" width="120">
            <template slot-scope="scope">
              {{
                new Date(Number(scope.row.create_time) * 1000)
                  .toLocaleString()
                  .replace(/:\d{1,2}$/, " ")
              }}
            </template>
          </el-table-column>
          <el-table-column prop="carrier_name" label="承运商" width="180">
          </el-table-column>
          <el-table-column prop="total_expenses" label="金额(元)" width="100">
          </el-table-column>
          <el-table-column prop="waybill_no" label="运单号" width="180">
            <template slot-scope="scope">
              <div
                style="cursor: pointer; color: blue"
                @click="handleJump(scope)"
              >
                {{ scope.row.waybill_no }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="waybill_product_type"
            label="承运类型"
            width="100"
          >
          </el-table-column>
          <el-table-column
            prop="package_type_name"
            label="包装型号"
            width="100"
          >
          </el-table-column>
          <el-table-column
            prop="waybill_create_time"
            label="运单创建时间"
            width="180"
          >
          </el-table-column>
          <el-table-column prop="from_region" label="发站" width="180">
          </el-table-column>
          <el-table-column prop="to_region" label="到站" width="180">
          </el-table-column>
          <el-table-column prop="from_area_name" label="出发区域" width="150">
          </el-table-column>
          <el-table-column prop="to_area_name" label="目的区域" width="150">
          </el-table-column>
          <el-table-column
            prop="customer_area_name"
            label="客户所属区域"
            width="180"
          >
          </el-table-column>
          <el-table-column prop="customer_id_name" label="客户名称" width="120">
          </el-table-column>
          <el-table-column prop="number" label="件数" width="80">
          </el-table-column>
          <el-table-column prop="weight" label="重量" width="80">
          </el-table-column>
          <el-table-column prop="volume" label="体积" width="80">
          </el-table-column>
          <el-table-column prop="package_quantity" label="包装数量" width="80">
          </el-table-column>
          <el-table-column
            fixed="right"
            label="调账"
            width="100"
            v-if="account_adjust_money_switch == 1"
          >
            <template slot-scope="scope">
              <el-button
                @click="handleClick(scope.row)"
                type="text"
                size="small"
                v-if="scope.row.status == 0"
                >调账</el-button
              >
              <!-- <el-button
                @click="handleClick(scope.row)"
                type="text"
                size="small"
                v-if="scope.row.status == 1"
                :disabled="true"
                >调账</el-button
              > -->
            </template>
          </el-table-column>
        </el-table>
        <div style="margin: 10px 0px 0px 0px; text-align: right">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage4"
            :page-sizes="[10, 20, 30, 40]"
            :page-size="100"
            layout="total, sizes, prev, pager, next, jumper"
            :total="totalList"
          >
          </el-pagination>
        </div>
        <div slot="footer" class="dialog-footer" style="text-align: center">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="countersign(1)">确 定</el-button>
        </div>
        <!-- 调账数据 -->
      </el-dialog>
      <div v-if="Object.keys(AuditDetails).length != 0">
        <approval
          :AuditDetails="AuditDetails"
          :fatherMethod="fatherMethod"
          style="width: 100%"
          :key="Math.random()"
        >
        </approval>
      </div>
      <div class="commentdialog">
        <el-dialog
          title="添加评论"
          :visible.sync="commdialogVisible"
          width="30%"
        >
          <!-- <el-input :row="1" v-model="recordex.content" type="textarea" autosize></el-input> -->
          <div style="margin-bottom: 10px">
            <!-- <el-input type="textarea" :rows="4" v-model="opinionFile.opinion"
                placeholder="请输入审核意见内容"></el-input> -->
            <quillLink
              :AuditDetails="AuditDetails"
              ref="quilldata"
              @showCityName="updateCity"
            ></quillLink>
          </div>
          <div style="margin: 10px 0px 0px 0px; display: flex">
            <!-- <div style="margin: 6px 10px 0px 0px;">上传附件:</div> -->
            <UploadLink :files.sync="recordex.annex"></UploadLink>
          </div>
          <div slot="footer" class="dialog-footer" style="text-align: center">
            <el-button @click="commdialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="preserveComment()"
              >确 定</el-button
            >
          </div>
        </el-dialog>
      </div>
      <div class="auditOpinion">
        <el-dialog
          title="审核意见"
          :visible.sync="auditOpinionVisble"
          width="30%"
        >
          <div style="margin-bottom: 10px">
            <el-input
              type="textarea"
              :rows="4"
              v-model="opinionFile.opinion"
              placeholder="请输入审核意见内容"
            ></el-input>
          </div>
          <div class="uploadList">
            <el-upload
              action
              :auto-upload="false"
              list-type="picture-card"
              :before-remove="beforeRemove"
              :on-preview="handlePreview"
              :on-remove="handleRemove"
              :on-change="handleChange"
              :file-list="fileList"
            >
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisibleoutList">
              <img width="100%" :src="dialogImageUrlList" alt="" />
            </el-dialog>
          </div>
          <div></div>
          <div slot="footer" class="dialog-footer" style="text-align: center">
            <el-button type="primary" @click="PassAuditcancel()"
              >取消</el-button
            >
            <el-button
              type="primary"
              v-if="PassAuditsucced == 1"
              @click="PassAuditVisble()"
              >审核通过</el-button
            >
            <el-button
              type="primary"
              v-if="PassAuditsucced == 2"
              @click="ReviewAudit()"
              >审核驳回</el-button
            >
          </div>
        </el-dialog>
      </div>
      <!-- 催办  -->
      <div class="presstodo">
        <el-dialog title="选择催办人" :visible.sync="outerVisible">
          <div>
            <el-transfer
              v-model="outerVisibleList"
              :props="{
                key: 'id',
                label: 'name',
              }"
              :data="AuditDetails.urge_relation_user"
              :titles="['全选', '已选']"
            >
            </el-transfer>
          </div>
          <div slot="footer" class="dialog-footer">
            <el-button @click="outerVisible = false">取 消</el-button>
            <el-button type="primary" @click="outerVisibleconfirm()"
              >确定</el-button
            >
          </div>
        </el-dialog>
      </div>
      <!-- 诊断 -->
      <div
        class="diagnostic"
        v-if="this.TypeList != 0 && formdata.relation_type == '3'"
      >
        <diagnosticMo
          :diagVisible="diaouterVisible"
          @diagVisiblefalse="diaouterVisibleclose"
          :reimburse_apply_id="this.$route.query.id"
        ></diagnosticMo>
      </div>
      <!--运单诊断  -->
      <div>
        <el-dialog
          title="运单诊断"
          :visible.sync="centerDialogwayBill"
          width="30%"
          center
        >
          <div>
            <span style="margin: 0px 5px 0px 0px">节点类型 :</span>
            <el-select
              style="width: 200px"
              placeholder="请输入节点类型"
              clearable
              filterable
              v-model="node_type_id"
            >
              <el-option
                v-for="item in node_type_list"
                :key="item.value"
                :label="item.label"
                :value="item.value + ''"
              />
            </el-select>
            <el-button
              type="primary"
              @click="centerDiaBill()"
              style="margin: 0px 0px 0px 10px"
              >诊断</el-button
            >
          </div>
          <div>
            <div style="margin: 10px 0px 0px 0px" v-if="cause_failure != ''">
              <span>诊断原因 :</span>
              <span style="color: #f56c6c; margin: 0px 0px 0px 5px">{{
                cause_failure
              }}</span>
            </div>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button @click="centerDialogwayBill = false">取 消</el-button>
          </span>
        </el-dialog>
      </div>
    </div>
    <!-- 转办 -->
    <div v-if="dialogturn">
      <TurnTohold
        :audit_id_list="audit_id_list"
        @listenToChildEvent="showMsgfromChild"
        :AuditDetails="AuditDetails"
      ></TurnTohold>
    </div>
     <!-- 客户诊断 -->
     <div v-if="customerData.diagnosis">
      <customerDiagnosis :customerData="customerData" :fatherMethodDetail="fatherMethodHandle"  ></customerDiagnosis>
   </div>
  </div>
</template>
<script>
// import {
//   uploading,
// } from "../../material/common/common";
import { branchList } from "@/api/Largewidthmeterlist";
import TurnTohold from "@/components/TurnTohold/TurnTohold.vue";
import { getTransportsList } from "@/api/waybill";
import {
  reqCheckWaybillFees,
  modifyCheckWaybillFees, //修改运单的金额
  finance_invoice_book_options,
  reimburse_apply_carry_export,
} from "@/api/finance";
import quillLink from "@/components/quillLink/quillLink.vue";
import { downloadFile, PagewebsiteList } from "@/page/material/common/common";
import UploadLink from "@/components/uploadFile/uploadLink.vue";
import {
  carrierID,
  customerPeople,
  InvoiceBookoptions,
} from "../../../api/information";
import {
  finance_invoice_book_box,
  preimburse_apply_export,
  paymentrequest,
  examine_record_send_message,
} from "../../../api/paymentrequest";
import { levelOptions } from "../../../api/organization";
import { dictionanryList } from "@/page/material/common/common";
import {
  reimburseCreate,
  reimburseDetail,
  reimburseUpdate,
  carrierList,
  reimburseCancelPayment,
} from "../../../api/finance";
import { timestamp10 } from "@/utils/mUtils";
import { AdminBox } from "@/api/Dataview";
import { totalmem } from "os";
import { reqWebsiteList, regional_monthly_payment_check } from "@/api/customer";
import { organizationBox } from "@/api/organization";
import { invoice_book_box } from "@/api/finance";
import {
  record_process_detail,
  examine_record_update,
  examine_comment_create,
  examine_comment_delete,
  finance_reimburse_apply_check_carry,
} from "@/api/paymentrequest";
import { settingList } from "@/api/print";
import approval from "@/components/approval/approval.vue";
import diagnosticMo from "@/components/diagnosticMo/diagnosticMo";
import customerDiagnosis from "@/components/customerDiagnosis/customerDiagnosis.vue"
export default {
  name: "reimburelment",
  components: { approval, UploadLink, quillLink, diagnosticMo, TurnTohold,customerDiagnosis },
  data() {
    return {
      dialogVisibleoutList: false,
      changeWaybillFees: false, //调账数据
      dialogImageUrlList: [],
      titleTip: "报销管理",
      invocqdata: {
        inputValue: "",
      },
      formdata: {
        relation_type: "", // 类别 0客户 1承运商 2渡石 3运单
        relation_id: "", // 关联id 客户id, 承运商id, 渡石公司id
        share_department_id: "", // 分摊部门id
        company_invoice_body_id: "", // 报销公司发票簿主体id
        apply_name: "", // 申请名称
        charge_off_money: "", // 冲销备用金
        payee: "", // 收款人id
        open_bank_name: "", // 开户行名称
        open_bank_account: "", // 开户行账号
        apply_reason: "", // 申请原因
        reimburse_type: "", //报销类型
        expenditure_list: [
          {
            id: "1",
            fee_id: "", // 费项id
            fee_detail: "", // 费项明细
            date: "", // 日期
            money: "", // 金额
            // remark: "",//备注
            enclosure_list: [], // 附件
          },
        ],
        is_initiate_audi: "", //保存 0 发起审批1
        carry_all_data: [], //上传是数据
        // ================
        is_used_petty_cash: "0", //是否使用备用金 0否 1是
        petty_cash_id: "", //备用金账户id
        share_type: "0", //分摊方式 0 按金额分摊 1 按比例分摊
        receive_bank: "", // 行名
        receive_bank_number: "", // 行号
        receive_account: "", // 收款账号
        appendix: [],
        share: [
          // 分摊列表
          {
            share_branch_id: "", // 费用分摊部门id
            share_branch_id_name: "", // 费用分摊部门名称
            share_content: "", // 金额/分摊比例
          },
        ],
      },
      formrule: {
        apply_reason: [
          { required: true, message: "请输入申请原因", trigger: "blur" },
        ],
        reimburse_type: [
          { required: true, message: "报销类型", trigger: "blur" },
        ],
        charge_off_money: [
          { required: true, message: "冲抵备用金", trigger: "blur" },
        ],
        payee: [{ required: true, message: "收款人", trigger: "blur" }],
        receive_bank: [
          { required: true, message: "收款人银行", trigger: "blur" },
        ],
        receive_account: [
          { required: true, message: "收款人银行账号", trigger: "blur" },
        ],
        share_branch_id: [
          { required: true, message: "请输入分摊部门", trigger: "blur" },
        ],
        company_invoice_body_id: [
          { required: true, message: "报销主体", trigger: "change" },
        ],
        fee_id: [{ required: true, message: "费项", trigger: "blur" }],
        date: [{ required: true, message: "日期", trigger: "blur" }],
        money: [{ required: true, message: "金额", trigger: "blur" }],
        petty_cash_id: [
          { required: true, message: "请选择备用金账号", trigger: "blur" },
        ],
        relation_type: [
          { required: true, message: "请选择关联对象类型", trigger: "blur" },
        ],
        relation_id: [
          { required: true, message: "请选择关联对象", trigger: "blur" },
        ],
      },
      actualAmount: "0", //实际金额 金额减去备用金金额
      collectMoeny: "", //费用明细汇总
      categoryList: [
        // {
        //   id: "0",
        //   name: "客户",
        // },
        // {
        //   id: "1",
        //   name: "承运商",
        // },
        // {
        //   id: "2",
        //   name: "渡石",
        // },
      ],
      waycategoryList: [
        // {
        //   id: "0",
        //   name: "客户",
        // },
        // {
        //   id: "1",
        //   name: "承运商",
        // },
        // {
        //   id: "2",
        //   name: "渡石",
        // },
        // {
        //   id: "3",
        //   name: "运单",
        // },
      ],
      relevanceObj: [], //关联对象
      orginList: [], //组织
      InvoiceBookList: [], //发票主体
      staffData: [], //员工
      travelExpenseList: [], //数据字典
      checkedID: [],
      queryID: "",
      accountType: [
        {
          id: "1",
          name: "运营费用",
        },
        {
          id: "2",
          name: "人事费用",
        },
        {
          id: "3",
          name: "销售费用",
        },
        {
          id: "4",
          name: "办公费用",
        },
        {
          id: "5",
          name: "其他费用",
        },
      ],
      travelExpenseList: [
        // {
        //   id: "1",
        //   name: "差旅费"
        // },
        // {
        //   id: "2",
        //   name: "住宿费"
        // },
        // {
        //   id: "3",
        //   name: "交通费"
        // },
        // {
        //   id: "4",
        //   name: "招待费"
        // },
        // {
        //   id: "5",
        //   name: "团建费"
        // },
        // {
        //   id: "6",
        //   name: "通讯费"
        // },
        // {
        //   id: "7",
        //   name: "加油费"
        // },
        // {
        //   id: "8",
        //   name: "快递费"
        // },
        // {
        //   id: "9",
        //   name: "劳保费"
        // },
        // {
        //   id: "10",
        //   name: "办公费"
        // },
        // {
        //   id: "11",
        //   name: "采购运营物质"
        // },
        // {
        //   id: "12",
        //   name: "运营费用"
        // },
        // {
        //   id: "13",
        //   name: "其他"
        // },
      ], //运营费
      people_fee: [
        {
          id: "1",
          name: "团建费",
        },
        {
          id: "2",
          name: "劳保费",
        },
      ], //人事费用
      market_fee: [
        {
          id: "1",
          name: "招待费",
        },
      ], //销售费用
      world_fee: [
        {
          id: "1",
          name: "办公费",
        },
        {
          id: "2",
          name: "快递费",
        },
        {
          id: "3",
          name: "通讯费",
        },
      ],
      rests_fee: [
        {
          id: "1",
          name: "住宿费",
        },
        {
          id: "2",
          name: "差旅费",
        },
      ],
      dialogFormVisible: false,
      tableData: [],
      spanVal: [], //处理过的用于合并行的表格数据
      queryDate: {
        relation_no: "", //批次号
        waybill_no: "", //运单号
        carrier_id: "", //承运商id
        from_region: "", //始发城市
        to_region: "", //目的城市
        waybill_create_time: {
          start_time: "", //开始时间
          end_time: "", //结束时间
        },
        customer_id: "", //客户
        customer_area_id: "", //客户所属区域
        from_network_id: "", //出发网点
        to_network_id: "", //目的网点
        from_area_id: "", //出发区域
        to_area_id: "", //目的区域
        waybill_product_type: "", //承运类型
        waybill_list_create: [], //
        page: "1",
        page_size: "10",
        commencement: [
          new Date().setTime(new Date().getTime() - 3600 * 1000 * 24 * 30 * 6),
          new Date().getTime(),
        ],
        node_type: "", //批次类型
      },
      commonCarrier: [],
      checkedRows: [], //单选框
      chcokeRows001: [], //列表选中框
      spanValcheckedRows: [],
      currentPage4: 1,
      totalList: 0,

      disabledType: false,
      reqWebsiteData: [],
      optionsList: [], //备用金账户
      imprestFund: "", //备用金余额
      share_option: [
        {
          value: "0",
          label: "按金额分摊",
        },
        {
          value: "1",
          label: "按比例分摊",
        },
      ],
      Tabs: "", //切换的页
      TypeList: 0,
      AuditDetails: {},
      commdialogVisible: false,
      recordex: {
        examine_record_id: "", // 审核记录id
        content: "", // 内容
        annex: [],
      },
      audit_id_list: "",
      auditOpinionVisble: false,

      dialogImageUrl: "",
      fileList: [], //上传的文件
      PassAuditsucced: "", // 1 是 审核通过按钮  2 是审核驳回按钮
      opinionFile: {
        opinion: "", //审核意见
        opinion_annex: [],
      },
      contentList: {},
      outerVisible: false,
      outerVisibleList: [],
      diaouterVisible: false,
      customerList: [], //客户列表
      websiteList: [], //客户所属区域
      originListData: [], //出发网点
      websiteListDQ: [], //出发区域
      transportsType: [], //承运类型
      carryInfo: "",
      changeWaybillFees: false,
      adjustWaybillFee: "",
      reasonList: "", //调整远y
      contentData: [], //内容数据
      clientList: [],
      centerDialogwayBill: false,
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      node_type_list: [
        {
          value: "1",
          label: "揽收",
        },
        {
          value: "2",
          label: "干线",
        },
        {
          value: "3",
          label: "配送",
        },
        {
          value: "4",
          label: "回单",
        },
        {
          value: "5",
          label: "回箱",
        },
      ],
      node_type_id: "",
      cause_failure: "",
      tableTabe: "",
      chooseData: "", //单选选中的数据
      selectedTure: "", //用来判断是选中还是删除
      adjustWaybillFeeOriginal: [],
      itemKey: "",
      usernameflase: false,
      dialogturn: false,
      account_adjust_money_switch: "0",
      customerData:{
        customer_id:"",
        search_time:"",
        diagnosis:false
      }
    };
  },
  watch: {
    "formdata.expenditure_list": {
      deep: true,
      handler() {
        if (this.formdata.relation_type != 3) {
          var loaMoery = 0;
          if (this.formdata.expenditure_list != null) {
            this.formdata.expenditure_list.forEach((val, index) => {
              loaMoery += val.money * 1;
            });
            this.collectMoeny = loaMoery.toFixed(2);
            if (this.formdata.share_type == 0 && this.TypeList == 0) {
              this.formdata.share[0].share_content = this.collectMoeny + "";
            } else {
              // this.formdata.share[0].share_content = ""
            }
          }
        }
      },
    },
    spanValcheckedRows: {
      deep: true,
      handler() {
        if (this.formdata.relation_type == 3) {
          var loaMoery = 0;
          if (this.spanValcheckedRows != null) {
            this.spanValcheckedRows.forEach((val, index) => {
              if (val.collapseNumber != "0") {
                loaMoery += val.total_expenses * 1;
              }
            });
            this.collectMoeny = loaMoery.toFixed(2);
            if (this.formdata.share_type == 0 && this.TypeList == 0) {
              this.formdata.share[0].share_content = this.collectMoeny + "";
            } else {
            }
          }
        }
      },
    },
    collectMoeny: {
      deep: true,
      handler() {
        this.actualAmount = (
          this.collectMoeny - this.formdata.charge_off_money
        ).toFixed(2);
      },
    },
    "formdata.charge_off_money": {
      deep: true,
      handler() {
        if (this.formdata.is_used_petty_cash == 1) {
          // if (this.imprestFund != "") {
          //   if (this.imprestFund * 1 < this.formdata.charge_off_money * 1) {
          //     this.open3("使用的冲抵备用金不能超过备用金金额", "warning")
          //     this.formdata.charge_off_money = ""
          //   }
          // }
          this.actualAmount = (
            this.collectMoeny - this.formdata.charge_off_money
          ).toFixed(2);
          // if (this.formdata.charge_off_money * 1 > this.collectMoeny * 1) {
          //   this.open3("使用的冲抵备用金不能超过报销金额", "warning")
          //   this.formdata.charge_off_money = ""
          // } else {
          //   this.actualAmount = this.collectMoeny - this.formdata.charge_off_money
          // }
        }
      },
    },

    "formdata.share": {
      handler() {
        // if (this.formdata.share_type == 0) {
        //   let total = 0
        //   for (let i = 0; i < this.formdata.share.length; i++) {
        //     total += Number(this.formdata.share[i]["share_content"]);
        //   }
        //   var allcollectMoney = (this.collectMoeny == "" ? 0 : this.collectMoeny)
        //   if (allcollectMoney != 0) {
        //     if (total > allcollectMoney) {
        //       this.open3("分摊金额不能超过付款金额", "warning")
        //       for (let i = 0; i < this.formdata.share.length; i++) {
        //         this.formdata.share[i]["share_content"] = ""
        //         this.$forceUpdate(); // 强制更新表格
        //       }
        //     }
        //   }
        // } else if (this.formdata.share_type == 1) {
        //   let total = 0
        //   for (let i = 0; i < this.formdata.share.length; i++) {
        //     total += Number(this.formdata.share[i]["share_content"]);
        //   }
        //   if (total > "100") {
        //     this.open3("分摊比例不能超过100%", "warning")
        //     for (let i = 0; i < this.formdata.share.length; i++) {
        //       this.formdata.share[i]["share_content"] = ""
        //       this.$forceUpdate(); // 强制更新表格
        //     }
        //   }
        // }
      },
      deep: true,
    },
    "formdata.share_type": {
      deep: true,
      handler() {
        // // console.log(this.formdata.share_type,"分摊方式的的")
        // if (this.formdata.share_type == 0 ) {
        //   this.formdata.share[0].share_content = this.collectMoeny + ""
        // } else {
        //   this.formdata.share[0].share_content = ""
        // }
      },
    },

    "formdata.reimburse_type": {
      handler() {
        console.log("报销类型发生了变化")
        if (this.formdata.reimburse_type == 1) {
          this.travelExpenseList = [
            {
              id: "1",
              name: "车辆租赁费",
            },
            {
              id: "2",
              name: "耗材租赁费",
            },
            {
              id: "3",
              name: "采购运营物资",
            },
            {
              id: "4",
              name: "加油费",
            },
            {
              id: "5",
              name: "快递费",
            },
            {
              id: "6",
              name: "其它",
            },
          ];
          this.waycategoryList = [
          {
          id: "0",
          name: "客户",
        },
        {
          id: "1",
          name: "承运商",
        },
        {
          id: "3",
          name: "运单",
        },
          ]
        } else if (this.formdata.reimburse_type == 2) {
          this.travelExpenseList = [
            {
              id: "1",
              name: "团建费",
            },
            {
              id: "2",
              name: "劳保费",
            },
            {
              id: "3",
              name: "其它",
            },
          ];
          this.waycategoryList = [
              {
                id: "0",
                name: "客户",
              },
              {
                id: "1",
                name: "承运商",
              },
              {
                id: "2",
                name: "渡石",
              },
            ]
        } else if (this.formdata.reimburse_type == 3) {
          this.travelExpenseList = [
            {
              id: "1",
              name: "差旅费",
            },
            {
              id: "2",
              name: "住宿费",
            },
            {
              id: "3",
              name: "交通费",
            },
            {
              id: "4",
              name: "招待费",
            },
            {
              id: "5",
              name: "通讯费",
            },
            {
              id: "6",
              name: "办公费",
            },
            {
              id: "7",
              name: "其它",
            },
          ];
          this.waycategoryList = [
              {
                id: "0",
                name: "客户",
              },
              {
                id: "1",
                name: "承运商",
              },
            ]
        } else if (this.formdata.reimburse_type == 4) {
          this.travelExpenseList = [
            {
              id: "1",
              name: "房租",
            },
            {
              id: "2",
              name: "物业",
            },
            {
              id: "3",
              name: "网费",
            },
            {
              id: "4",
              name: "水费",
            },
            {
              id: "5",
              name: "电费",
            },
            {
              id: "6",
              name: "其它",
            },
            {
              id: "7",
              name: "差旅费",
            },
            {
              id: "8",
              name: "住宿费",
            },
            {
              id: "9",
              name: "交通费",
            },
            {
              id: "10",
              name: "招待费",
            },
            {
              id: "11",
              name: "通讯费",
            },
            {
              id: "12",
              name: "办公费",
            },
          ];
          this.waycategoryList = [
              {
                id: "0",
                name: "客户",
              },
              {
                id: "1",
                name: "承运商",
              },
              {
                id: "2",
                name: "渡石",
              },
            ]
        } else if (this.formdata.reimburse_type == 5) {
          this.travelExpenseList = [
            {
              id: "1",
              name: "其它",
            },
          ];
          this.waycategoryList = [
              {
                id: "0",
                name: "客户",
              },
              {
                id: "1",
                name: "承运商",
              },
              {
                id: "2",
                name: "渡石",
              },
            ]
        }else {
          this.waycategoryList = [
              {
                id: "0",
                name: "客户",
              },
              {
                id: "1",
                name: "承运商",
              },
              {
                id: "2",
                name: "渡石",
              },
            ]
        }
        if (this.Tabs == 0) {
          if (this.formdata.expenditure_list !== null) {
            if (this.formdata.expenditure_list.length > 0) {
              for (var i = 0; i < this.formdata.expenditure_list.length; i++) {
                this.handleFeeChange(this.formdata.expenditure_list[i]);
                this.handleFeeChangeType(this.formdata.expenditure_list[i]);
              }
            }
          }
        }
     
     
      },
      deep: true,
    },
    actualAmount: {
      deep: true,
      handler() {
        if (this.actualAmount == 0) {
          this.usernameflase = true;
          this.formdata.receive_account = "";
          this.formdata.receive_bank = "";
          this.formdata.payee = "";
        } else {
          this.usernameflase = false;
        }
      },
    },
  },

  filters: {
    afterTime(value) {
      switch (value) {
        case "1":
          return "揽收";
        case "2":
          return "干线";
        case "3":
          return "配送";
        case "4":
          return "回单";
        case "5":
          return "回箱";
      }
    },
    afterstatus(value) {
      switch (value) {
        case "0":
          return "可以报销";
        default:
          return "不可报销";
      }
    },
  },
  beforeMount() {
    this.invoiceBox();
  },
  mounted() {
    this.getCustomerList(); //客户接口
    this.getWebsiteList(); //客户所属区域
    this.getWebsiteListDQFn(); //所属区域
    this.getThermosphereType(); //承运类型
    // this.invoiceBox(); // 备用金接口加载
    this.siteListFn();
    this.localgetdata = JSON.parse(localStorage.getItem("user"));
    this.levelOptionsobj();
    this.InvoiceBookoptionsObj();
    this.branchnameClickFn();
    this.PagecommonCarrier();
    this.reqWebsiteListFn();
    this.TypeList = this.$route.query.Type;
    this.Tabs = this.$route.query.TageType;

    if (this.Tabs == 3 || this.Tabs == 5 || this.Tabs == 7) {
      this.audit_id_list = this.$route.query.audit_id;
      this.record_process_detailObj();
    }

    if (this.TypeList == 2) {
      this.disabledType = true;
      this.DetailedData(this.$route.query.id);
    } else if (this.TypeList == 1) {
      this.disabledType = false;
      this.DetailedData(this.$route.query.id);
    } else if (this.TypeList == 0) {
      // this.localgetdata = JSON.parse(localStorage.getItem('user'))
      this.formdata.share[0].share_branch_id = this.localgetdata.branch_id + "";
    }
    if (this.actualAmount == 0) {
      this.usernameflase = true;
      this.formdata.receive_account = "";
      this.formdata.receive_bank = "";
      this.formdata.payee = "";
    } else {
      this.usernameflase = false;
    }
  },
  methods: {
    async getSettingItem() {
      let result = await settingList({
        item_name: "account_adjust_money_users",
      });
      this.account_adjust_money_switch =
        JSON.parse(result.data.settings[0].item_info).indexOf(
          JSON.parse(localStorage.getItem("user")).user_id
        ) != -1;
    },
    // 非备用金账号
    invoiceBox() {
      var param = {
        invoice_body_name: "",
      };
      invoice_book_box(param).then((res) => {
        if (res.code == 10000) {
          this.optionsList = res.data;
        }
      });
    },
    // 详情数据
    async DetailedData(value) {
      var param = {
        id: value,
      };
      var res = await reimburseDetail(param);
      this.formdata.relation_type = await res.data.relation_type;
      if (res.data.relation_type == "3") {
        var carry_all_list_01 = res.data.carry_full_ids;
        // res.data.carry_all_data.forEach((itme) => {
        //   carry_all_list_01.push(itme[0].id);
        // });
        this.checkedRows = carry_all_list_01;
        await this.countersign();
      }

      if (res.data.expenditure_list != null) {
        res.data.expenditure_list.forEach((item) => {
          if (item.date != 0) {
            item.date = item.date * 1000;
          } else {
            item.date = "";
          }
          if (item.fee_id == 0) {
            item.fee_id = "";
          }
        });
      } else {
      }
      if (res.data.is_used_petty_cash == 1) {
        this.SelectedData(res.data.petty_cash_id);
      }
      this.formdata = {
        ...res.data,
        relation_id:
          res.data.relation_id * 1 == 0 ? "" : res.data.relation_id * 1,
        share_department_id:
          res.data.share_department_id * 1 == 0
            ? ""
            : res.data.share_department_id * 1,
        company_invoice_body_id:
          res.data.company_invoice_body_id * 1 == 0
            ? ""
            : res.data.company_invoice_body_id + "",
        payee: res.data.payee,
        expenditure_list: res.data.expenditure_list,
        carry_all_data: res.data.carry_all_data,
      };
      this.relationList();
      console.log(this.formdata.status, " this.formdata  this.formdata ");
      // 看审批的状态
      // this.Tabs == 1 || this.Tabs == 2
      if (this.formdata.status != 0) {
        this.audit_id_list = res.data.examine_id;
        this.record_process_detailObj();
      }
    },
    reimburedelet() {
      // this.formdata.expenditure_list.forEach((v, i) => {
      //   this.checkedID.forEach((val, index) => {
      //     if (val == v.id) {
      //       this.formdata.expenditure_list.splice(i, 1);
      //     }
      //   });
      // });
      this.formdata.expenditure_list = this.formdata.expenditure_list.filter(
        (item) => !this.checkedID.includes(item.index)
      );
    },
    reimbureadd() {
      var id_length = this.formdata.expenditure_list.length + 1;
      this.formdata.expenditure_list.push({
        id: id_length,
        fee_id: "", // 费项id
        fee_detail: "", // 费项明细
        date: "", // 日期
        money: "", // 金额
        // remark: "",//备注
        enclosure_list: [], // 附件
      });
    },
    handleChange(file, fileList, index) {
      var filelist = file.raw; //文件
      var filename = file.raw.uid + file.raw.name; //通过 uid和name组成文件的名字
      uploading(filelist, filename, 30).then((result) => {
        var resname = result.name;
        this.ImportDataUrl = resname;
        var filehttp = "http://oss.dushisc.com/";
        this.formdata.expenditure_list[index].enclosure_list.push({
          name: filehttp + result.name,
          url: filehttp + result.name,
        });
      });
    },
    async handleChangeTwo(file, fileList, index) {
      var filelist = file.raw; //文件
      var filename = file.raw.uid + file.raw.name; //通过 uid和name组成文件的名字
      const result = await uploading(filelist, filename, 30);
      var resname = result.name;
      this.ImportDataUrl = resname;
      var filehttp = "http://oss.dushisc.com/";
      this.spanValcheckedRows[index].carry_all_data[0].enclosure_list.push({
        name: filehttp + result.name,
        url: filehttp + result.name,
      });
      this.$forceUpdate();
    },
    removeChange(file, index) {
      if (this.formdata.expenditure_list[index].enclosure_list.length > 0) {
        for (
          var i = 0;
          i < this.formdata.expenditure_list[index].enclosure_list.length;
          i++
        ) {
          if (
            this.formdata.expenditure_list[index].enclosure_list[i].uid ==
            file.uid
          ) {
            this.formdata.expenditure_list[index].enclosure_list.splice(i, 1);
          }
        }
      }
    },
    removeChangeTwo(file, index) {
      if (
        this.spanValcheckedRows[index].carry_all_data[0].enclosure_list.length >
        0
      ) {
        for (
          var i = 0;
          i <
          this.spanValcheckedRows[index].carry_all_data[0].enclosure_list
            .length;
          i++
        ) {
          if (
            this.spanValcheckedRows[index].carry_all_data[0].enclosure_list[i]
              .uid == file.uid
          ) {
            this.spanValcheckedRows[
              index
            ].carry_all_data[0].enclosure_list.splice(i, 1);
          }
        }
      }
    },
    levelOptionsobj() {
      var param = {
        pid: "1",
        name: "",
      };
      levelOptions(param).then((res) => {
        this.orginList = res.data;
      });
    },
    InvoiceBookoptionsObj() {
      var param = {
        // 主体名
        invoice_body_name: "",
        invoice_body_belong: "0", // 发票主体所属：0公司，1客户，2承运商
        belong_to_id: "", // 所属id
      };
      finance_invoice_book_box(param).then((res) => {
        if (res.code == "10000") {
          this.InvoiceBookList = res.data;
        }
      });
    },
    branchnameClickFn() {
      const data = {};
      AdminBox(data).then((res) => {
        if (res.code === 10000) {
          this.staffData = res.data;
        }
      });
    },
    tableRowClassName(row) {
      // 给每条数据添加一个索引
      row.row.index = row.rowIndex;
    },
    reimbureaddchange(val) {
      this.checkedID = val.map((item) => item.index);
    },
    preserveadd(formName, value) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.collectMoeny > 0) {
            this.formdata.expenditure_list.forEach((item) => {
              item.date = timestamp10(item.date) + "";
            });
            // var carr_all_list = [];
            // this.spanValcheckedRows.filter((itme) => {
            //   carr_all_list.push(itme.carry_all_data[0]);
            // });
            // var result = [];
            // var obj = {};
            // for (var i = 0; i < carr_all_list.length; i++) {
            //   if (!obj[carr_all_list[i].id]) {
            //     result.push(carr_all_list[i]);
            //     obj[carr_all_list[i].id] = true;
            //   }
            // }
            var data_time_id = this.spanValcheckedRows.map(
              (item) => item.time_id
            );
            var datalsit = Array.from(data_time_id, (arr) => arr).flat();
            var result = [...new Set(datalsit)];
            if (this.formdata.share_type == 0) {
              let total = 0;
              for (let i = 0; i < this.formdata.share.length; i++) {
                total += Number(this.formdata.share[i]["share_content"]);
              }
              var allcollectMoney =
                this.collectMoeny == "" ? 0 : this.collectMoeny;

              if (allcollectMoney != 0) {
                if (
                  total.toFixed(2) == allcollectMoney &&
                  this.formdata.charge_off_money * 1 <= this.collectMoeny * 1
                ) {
                  var param = {
                    ...this.formdata,
                    relation_id: this.formdata.relation_id + "",
                    share_department_id: this.formdata.share_department_id + "",
                    company_invoice_body_id:
                      this.formdata.company_invoice_body_id + "",
                    payee: this.formdata.payee,
                    is_initiate_audi: value, //保存的时候0 发起审批1
                    expenditure_list: this.formdata.expenditure_list,
                    carry_full_ids: result.map(Number),
                  };
                  reimburseCreate(param).then((res) => {
                    if (res.code == "10000") {
                      if (value == 0) {
                        this.open3("保存成功", "success");
                      } else if (value == 1) {
                        this.open3("发起审批成功", "success");
                      }
                      this.presercancel();
                    }
                  });
                } else {
                  if (
                    this.formdata.charge_off_money * 1 >
                    this.collectMoeny * 1
                  ) {
                    this.open3("使用的冲抵备用金不能超过报销金额", "warning");
                  } else {
                    this.open3("分摊总金额需等于付款金额", "warning");
                  }
                }
              }
            } else if (this.formdata.share_type == 1) {
              let total = 0;
              for (let i = 0; i < this.formdata.share.length; i++) {
                total += Number(this.formdata.share[i]["share_content"]);
              }
              if (
                total == "100" &&
                this.formdata.charge_off_money * 1 <= this.collectMoeny * 1
              ) {
                var param = {
                  ...this.formdata,
                  relation_id: this.formdata.relation_id + "",
                  share_department_id: this.formdata.share_department_id + "",
                  company_invoice_body_id:
                    this.formdata.company_invoice_body_id + "",
                  payee: this.formdata.payee,
                  is_initiate_audi: value, //保存的时候0 发起审批1
                  expenditure_list: this.formdata.expenditure_list,
                  carry_all_data: result,
                };
                reimburseCreate(param).then((res) => {
                  if (res.code == "10000") {
                    if (value == 0) {
                      this.open3("保存成功", "success");
                    } else if (value == 1) {
                      this.open3("发起审批成功", "success");
                    }
                    this.presercancel();
                  }
                });
              } else {
                if (
                  this.formdata.charge_off_money * 1 >
                  this.collectMoeny * 1
                ) {
                  this.open3("使用的冲抵备用金不能超过报销金额", "warning");
                } else {
                  this.open3("分摊比例不能超过100%", "warning");
                }
              }
            }
            // var param = {
            //   ...this.formdata,
            //   relation_id: this.formdata.relation_id + "",
            //   share_department_id: this.formdata.share_department_id + "",
            //   company_invoice_body_id: this.formdata.company_invoice_body_id + "",
            //   payee: this.formdata.payee,
            //   is_initiate_audi: value,//保存的时候0 发起审批1
            //   expenditure_list: this.formdata.expenditure_list,
            //   carry_all_data: result
            // }
            // reimburseCreate(param).then((res) => {
            //   if (res.code == "10000") {
            //     if (value == 0) {
            //       this.open3("保存成功", "success")
            //     } else if (value == 1) {
            //       this.open3("发起审批成功", "success")
            //     }
            //     this.presercancel()
            //   }
            // })
          } else {
            this.open3("请输入报销金额", "warning");
          }
        } else {
          return false;
        }
      });
    },
    preserveEdit(formName, value) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.formdata.expenditure_list != null) {
            this.formdata.expenditure_list.forEach((item) => {
              item.date = timestamp10(item.date) + "";
            });
          }
          // var carr_all_list = [];
          // this.spanValcheckedRows.filter((itme) => {
          //   carr_all_list.push(itme.carry_all_data[0]);
          // });
          // var result = [];
          // var obj = {};
          // for (var i = 0; i < carr_all_list.length; i++) {
          //   if (!obj[carr_all_list[i].id]) {
          //     result.push(carr_all_list[i]);
          //     obj[carr_all_list[i].id] = true;
          //   }
          // }
          var data_time_id = this.spanValcheckedRows.map(
            (item) => item.time_id
          );
          var datalsit = Array.from(data_time_id, (arr) => arr).flat();
          var result = [...new Set(datalsit)];
          if (this.formdata.share_type == 0) {
            let total = 0;
            for (let i = 0; i < this.formdata.share.length; i++) {
              total += Number(this.formdata.share[i]["share_content"]);
            }
            var allcollectMoney =
              this.collectMoeny == "" ? 0 : this.collectMoeny;
            if (allcollectMoney != 0) {
              if (
                total.toFixed(2) == allcollectMoney &&
                this.formdata.charge_off_money * 1 <= this.collectMoeny * 1
              ) {
                var param = {
                  ...this.formdata,
                  id: this.$route.query.id,
                  relation_id: this.formdata.relation_id + "",
                  share_department_id: this.formdata.share_department_id + "",
                  company_invoice_body_id:
                    this.formdata.company_invoice_body_id + "",
                  payee: this.formdata.payee,
                  is_initiate_audi: value, //保存的时候0 发起审批1
                  expenditure_list: this.formdata.expenditure_list,
                  carry_full_ids: result.map(Number),
                };
                reimburseUpdate(param).then((res) => {
                  if (res.code == "10000") {
                    this.open3("编辑成功", "success");
                    this.presercancel();
                  }
                });
              } else {
                if (
                  this.formdata.charge_off_money * 1 >
                  this.collectMoeny * 1
                ) {
                  this.open3("使用的冲抵备用金不能超过报销金额", "warning");
                } else {
                  this.open3("分摊总金额需等于付款金额", "warning");
                }
              }
            }
          } else if (this.formdata.share_type == 1) {
            let total = 0;
            for (let i = 0; i < this.formdata.share.length; i++) {
              total += Number(this.formdata.share[i]["share_content"]);
            }
            if (
              total == "100" &&
              this.formdata.charge_off_money * 1 <= this.collectMoeny * 1
            ) {
              var param = {
                ...this.formdata,
                id: this.$route.query.id,
                relation_id: this.formdata.relation_id + "",
                share_department_id: this.formdata.share_department_id + "",
                company_invoice_body_id:
                  this.formdata.company_invoice_body_id + "",
                payee: this.formdata.payee,
                is_initiate_audi: value, //保存的时候0 发起审批1
                expenditure_list: this.formdata.expenditure_list,
                carry_all_data: result,
              };
              reimburseUpdate(param).then((res) => {
                if (res.code == "10000") {
                  this.open3("编辑成功", "success");
                  this.presercancel();
                }
              });
            } else {
              if (this.formdata.charge_off_money * 1 > this.collectMoeny * 1) {
                this.open3("使用的冲抵备用金不能超过报销金额", "warning");
              } else {
                this.open3("分摊比例不能超过100%", "warning");
              }
            }
          }
        } else {
          return false;
        }
      });
    },
    presercancel() {
      // if (this.Tabs == 5) {
      //   this.$router.push({ name: 'paymentManage', })
      // } else {
      //   this.$router.push({ name: 'reimburSement' })
      // }
      window.history.back();
    },
    formdatatyep() {
      this.formdata.relation_id = "";
      if (this.formdata.expenditure_list == null) {
        this.formdata.expenditure_list = [
          {
            id: "1",
            fee_id: "", // 费项id
            fee_detail: "", // 费项明细
            date: "", // 日期
            money: "", // 金额
            // remark: "",//备注
            enclosure_list: [], // 附件
          },
        ];
      }

      this.relationList();
    },
    relationList() {
      if (this.formdata.relation_type == 0) {
        // this.formdata.relation_id = ""
        var param = {
          name: "",
          is_send: "1",
          is_receive: "",
        };
        customerPeople(param).then((res) => {
          this.relevanceObj = res.data;
        });
      } else if (this.formdata.relation_type == 1) {
        // this.formdata.relation_id = ""
        var param = {
          name: "",
        };
        carrierID(param).then((res) => {
          this.relevanceObj = res.data;
        });
      } else if (this.formdata.relation_type == 2) {
        this.relevanceObj = [
          {
            id: 1,
            name: "北京渡石供应链科技有限公司",
          },
        ];
        this.formdata.relation_id = 1;
      }
    },
    open3(message, type) {
      this.$message({
        message: message,
        type: type,
      });
    },
    openUrl(file) {
      window.open(file.name);
    },
    pleaseChoose() {
      this.getSettingItem(); //获取调账开关设置
      this.dialogFormVisible = true;
      this.PagecarrierList();
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (
        columnIndex === 0 ||
        columnIndex === 1 ||
        columnIndex === 2 ||
        columnIndex === 3 ||
        columnIndex === 4 ||
        columnIndex === 5 ||
        columnIndex === 6 ||
        columnIndex === 20
      ) {
        //列的index
        //当xxx的时候合并rowspan行0列
        if (row.collapseNumber > 0) {
          return {
            rowspan: row.collapseNumber,
            colspan: 1,
          };
        } else {
          return {
            //表示这一行不显示
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
    objectSpanMethodspan({ row, column, rowIndex, columnIndex }) {
      if (
        columnIndex === 0 ||
        columnIndex === 1 ||
        columnIndex === 2 ||
        columnIndex === 3 ||
        columnIndex === 4 ||
        columnIndex === 5
      ) {
        //列的index
        //当xxx的时候合并rowspan行0列
        if (row.collapseNumber > 0) {
          return {
            rowspan: row.collapseNumber,
            colspan: 1,
          };
        } else {
          return {
            //表示这一行不显示
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
    PagecarrierList() {
      console.log(
        this.Timeverify(this.queryDate.commencement),
        "queryDate.commencement"
      );
      var param = {
        ids: [], // 承运小款表id
        carrier_id: this.queryDate.carrier_id + "",
        node_type: "", // 节点批次类型  1揽收 2干线 3配送 4回单 5回箱
        relation_no: this.queryDate.relation_no, // 批次号
        waybill_no: this.queryDate.waybill_no, // 运单号
        // start_time:  this.queryDate.commencement.length > 0 ? parseInt( this.queryDate.commencement[0] / 1000) + ""
        //       : "",
        // end_time: this.queryDate.commencement.length > 0 ?  parseInt(this.queryDate.commencement[1] / 1000 )+ ""
        //       : "",
        start_time: this.Timeverify(this.queryDate.commencement, 1), // 开始是1 结束是2
        end_time: this.Timeverify(this.queryDate.commencement, 2),
        from_region: this.queryDate.from_region + "",
        to_region: this.queryDate.to_region + "",
        customer_id: this.queryDate.customer_id + "",
        customer_area_id: this.queryDate.customer_area_id + "",
        from_network_id: this.queryDate.from_network_id + "",
        to_network_id: this.queryDate.to_network_id + "",
        from_area_id: this.queryDate.from_area_id + "",
        to_area_id: this.queryDate.to_area_id + "",
        waybill_product_type: this.queryDate.waybill_product_type + "",
        waybill_create_time: {
          // start_time:
          //   this.queryDate.waybill_list_create.length > 0
          //     ?  this.queryDate.waybill_list_create[0] / 1000 + ""
          //     : "",
          // end_time:
          //   this.queryDate.waybill_list_create.length > 0
          //     ? this.queryDate.waybill_list_create[1] / 1000 + ""
          //     : "",
          start_time: this.Timeverify(this.queryDate.waybill_list_create, 1),
          end_time: this.Timeverify(this.queryDate.waybill_list_create, 2),
        },
        page: this.queryDate.page * 1,
        page_size: this.queryDate.page_size * 1,
        status: "",
        node_type: this.queryDate.node_type, //批次类型
      };
      carrierList(param).then((res) => {
        this.tableData = res.data.data;
        this.totalList = res.data.pagination.total * 1;
        this.tableData.forEach((item, index) => {
          var param_id = [];
          item.forEach((item2, index2) => {
            param_id.push(item2.id);
            //item2是合并行里面的运单数据
            if (index2 === 0) {
              this.$set(item2, "collapseNumber", item.length); //应该合并几列
              this.$set(item2, "time_id", param_id); //应该合并几列
            } else {
              this.$set(item2, "collapseNumber", 0); //其余的不显示，标为0
              this.$set(item2, "time_id", param_id); //应该合并几列
            }
            this.$set(item2, "index", index); //操作单的索引
          });
        });
        setTimeout(() => {
          // this.itemKey = Math.random()
          this.spanVal = this.tableData.flat(2);
          var consloe_list = this.contentData.map(Number);
          this.$nextTick(() => {
            this.spanVal.forEach((row) => {
              if (consloe_list.includes(row.id * 1)) {
                this.$refs.dataTable.toggleRowSelection(row, true);
              }
            });
          });
        }, 500);
      });
    },
    async handleJump(scope) {
      //跳转到对应运单详情
      const checkedOrder = scope.row;
      const { waybill_id } = checkedOrder;
      let text = this.$router.resolve({
        name: "waybillDetail",
        query: { id: waybill_id, activeName: "1" },
      });
      window.open(text.href, "_blank");
    },
    PagecommonCarrier() {
      var param = {
        name: "",
      };
      carrierID(param).then((res) => {
        this.commonCarrier = res.data;
      });
    },
    queryDateSee() {
      this.queryDate.page = "1";
      this.queryDate.page_size = "10";
      this.PagecarrierList();
    },
    replaCemnent() {
      Object.assign(this.$data.queryDate, this.$options.data().queryDate);
      this.PagecarrierList();
    },
    handleSelectionChange(val) {
      var data_time_id = val.map((item) => item.time_id);
      var datalsit = Array.from(data_time_id, (arr) => arr).flat();
      var checkoutlsit = [...new Set(datalsit)];
      this.checkedRows = this.removeChooseData(
        checkoutlsit,
        this.chooseData,
        this.selectedTure
      );
    },
    async countersign(type) {
      this.dialogFormVisible = false;
      // const result = [...new Set(this.checkedRows)]
      var result = [];
      if (this.TypeList == 1 && type == 1) {
        // const allIds = this.formdata.carry_full_ids
        //   .flat()
        //   .map((item) => item.id);
        // console.log(this.contentData,"this.checkedRowsthis.checkedRows")
        var AllcontentData = this.contentData;
        const originalArray = [...new Set(this.checkedRows)];
        console.log(originalArray);
        AllcontentData.push(...originalArray);
        result = Array.from(new Set(AllcontentData.map(Number)));
        console.log(result, "选择关联费项选择关联费项");
      } else {
        result = [...new Set(this.checkedRows)];
      }
      this.contentData = result;
      var param = {
        ids: result.map(Number), // 承运小款表id
        carrier_id: this.queryDate.carrier_id + "",
        node_type: "", // 节点批次类型  1揽收 2干线 3配送 4回单 5回箱
        relation_no: "", // 批次号
        waybill_no: "", // 运单号
        start_time: "",
        end_time: "",
        page: 1,
        page_size: result.length * 1,
        status: "",
      };
      var res = await carrierList(param);

      if (this.checkedRows.length != 0) {
        this.tableData = res.data.data;
        this.tableData.forEach((item, index) => {
          var param_id = [];
          item.forEach((item2, index2) => {
            param_id.push(item2.id);
            //item2是合并行里面的运单数据
            if (index2 === 0) {
              this.$set(item2, "collapseNumber", item.length); //应该合并几列
              this.$set(item2, "time_id", param_id); //应该合并几列
            } else {
              this.$set(item2, "collapseNumber", 0); //其余的不显示，标为0
              this.$set(item2, "time_id", param_id); //应该合并几列
            }
            this.$set(item2, "index", index); //操作单的索引
          });
        });
        this.spanValcheckedRows = this.tableData.flat(2);
        this.spanValcheckedRows.forEach((itme) => {
          this.$set(itme, "carry_all_data", [
            {
              id: itme.id * 1,
              enclosure_list: [],
            },
          ]);
          if (this.formdata.carry_all_data != null) {
            this.formdata.carry_all_data.filter((itme_name) => {
              if (itme.id == itme_name[0].id) {
                this.$set(itme, "carry_all_data", [
                  {
                    id: itme.id * 1,
                    enclosure_list: itme_name[0].enclosure,
                  },
                ]);
              }
            });
          }
        });
      } else {
        this.spanValcheckedRows = [];
      }
    },
    removeChoose() {
      var chcokeRowsList = this.chcokeRows001.map(Number);
      console.log(chcokeRowsList, "chcokeRowsList");
      const result = this.removeElementsFromArray(
        this.contentData,
        chcokeRowsList
      );
      console.log(result);
      this.checkedRows = result;
      this.countersign();
    },
    totalmemClassname(val) {
      var data_time_id = val.map((item) => item.time_id);
      var datalsit = Array.from(data_time_id, (arr) => arr).flat();
      this.chcokeRows001 = [...new Set(datalsit)];
    },
    handleSizeChange(val) {
      this.queryDate.page_size = val;
      this.PagecarrierList();
    },
    handleCurrentChange(val) {
      this.queryDate.page = val;
      this.PagecarrierList();
    },
    getRowKeys(row) {
      return row.id + row.waybill_id + row.index;
    },
    addShiper() {
      this.formdata.share.push({
        share_branch_id: "",
        share_branch_id_name: "",
        share_content: "",
      });
    },
    reduce(index) {
      if (this.formdata.share.length > 1) {
        this.formdata.share.splice(index, 1);
      } else {
        this.$message({
          message: "这是最后一条数据",
          type: "warning",
        });
      }
    },
    reqWebsiteListFn() {
      let data = {
        pid: 1,
      };
      organizationBox(data).then((res) => {
        if (res.code === 10000) {
          this.reqWebsiteData = res.data;
        }
      });
    },
    SelectedData(val) {
      console.log(val, "==============================");

      var choose = this.optionsList.find((res) => res.id == val);
      console.log(
        this.optionsList,
        "this.optionsListthis.optionsListthis.optionsList"
      );
      console.log(choose, "21312123123");
      if (choose) {
        this.imprestFund = choose.balance;
      }
    },
    // ============
    // 审核的取消按钮
    AuditCancellation() {
      this.$router.push({ name: "auditrecordsList" });
    },
    // 审核通过
    PassAudit(value) {
      this.auditOpinionVisble = true;
      this.PassAuditsucced = value;
    },
    PassAuditcancel() {
      this.auditOpinionVisble = false;
      Object.assign(this.$data.opinionFile, this.$options.data().opinionFile);
    },

    PassAuditVisble() {
      var param = {
        id: this.audit_id_list + "", // 审核记录id
        status: "1", // 是否通过1通过 2打回
        ...this.opinionFile,
      };
      examine_record_update(param).then((res) => {
        if (res.code == "10000") {
          this.open3("审核通过成功", "success");
          this.record_process_detailObj();
          this.auditOpinionVisble = false;
          Object.assign(
            this.$data.opinionFile,
            this.$options.data().opinionFile
          );
          this.$router.go(-1);
        }
      });
    },
    // 审核驳回
    ReviewAudit() {
      var param = {
        ...this.opinionFile, //审核y
        id: this.audit_id_list + "", // 审核记录id
        status: "2", // 是否通过1通过 2打回
      };
      examine_record_update(param).then((res) => {
        if (res.code == "10000") {
          this.open3("审核驳回成功", "success");
          this.record_process_detailObj();
          this.auditOpinionVisble = false;
          Object.assign(
            this.$data.opinionFile,
            this.$options.data().opinionFile
          );
          this.$router.go(-1);
        }
      });
    },
    // 审核流程接口
    record_process_detailObj() {
      var param = {
        id: this.audit_id_list,
      };
      record_process_detail(param).then((res) => {
        this.AuditDetails = res.data;
        if (
          this.formdata.expenditure_list &&
          this.formdata.expenditure_list.length > 0
        ) {
          for (var i = 0; i < this.formdata.expenditure_list.length; i++) {
            this.handleFeeChangeType(this.formdata.expenditure_list[i]);
          }
        }
        this.$forceUpdate();
      });
    },
    //   添加评论
    AddComment() {
      this.commdialogVisible = true;
    },
    updateCity(value) {
      this.contentList = value;
    },
    // 保存评论
    preserveComment() {
      this.$refs.quilldata.preserveComment();
      var param = {
        ...this.recordex,
        content: this.contentList.content,
        examine_record_id: this.audit_id_list + "",
      };
      examine_comment_create(param).then((res) => {
        if (res.code == "10000") {
          this.open3("添加评论成功", "success");

          this.record_process_detailObj();
          this.commdialogVisible = false;
          Object.assign(this.$data.recordex, this.$options.data().recordex);
          this.$refs.quilldata.preserveCommentclear();
        }
      });
      var param = {
        examine_id: this.audit_id_list + "",
        receiver_ids: this.contentList.receiver_ids, // 数组int类型的用户id
        content: this.contentList.content, // 评论内容，  催办不用填
        type: "0", // 0评论 1催办
      };
      examine_record_send_message(param).then((res) => {
        this.record_process_detailObj();
        this.commdialogVisible = false;
      });
    },
    // 上传的功能
    beforeRemove(file, fileList) {
      return this.$confirm("是否删除该图片");
    },
    handlePreview(file) {
      this.dialogImageUrlList = file.url;
      this.dialogVisibleoutList = true;
    },
    handleRemove(file, fileList) {
      const index = this.opinionFile.opinionFile.findIndex(
        (item) => item.uid === file.uid
      );
      index > -1 && this.opinionFile.opinionFile.splice(index, 1);
    },
    handleChange(file, fileList, type) {
      this.fileList = fileList;
      var filelist = file.raw; //文件
      var filename = file.raw.uid + file.raw.name; //通过 uid和name组成文件的名字
      uploading(filelist, filename, type).then((res) => {
        this.opinionFile.opinion_annex.push({
          name: file.uid + "",
          url: res.res.requestUrls[0],
        });
      });
    },
    fatherMethod() {
      this.record_process_detailObj();
    },
    derivedDataItem() {
      var ids = this.$route.query.id;
      var param = {
        id: ids,
      };
      preimburse_apply_export(param).then((res) => {
        if (res.code == 10000) {
          downloadFile(res.data.loaded_url);
          this.$message({
            type: "success",
            message: "导出成功",
          });
        }
      });
    },
    approvaldata() {
      var param = {
        id: this.formdata.id,
      };
      reimburseCancelPayment(param).then((res) => {
        if (res.code == "10000") {
          this.presercancel();
          // this.open3("取消审批成功", "success")
          // this.handleSearch()
        }
      });
    },
    //
    pressab() {
      this.outerVisible = true;
    },
    outerVisibleconfirm() {
      var param = {
        examine_id: this.audit_id_list + "",
        receiver_ids: this.outerVisibleList.map(Number), // 数组int类型的用户id
        content: "", // 评论内容，  催办不用填
        type: "1", // 0评论 1催办
      };
      examine_record_send_message(param).then((res) => {
        this.record_process_detailObj();
        this.outerVisible = false;
      });
    },
    handleFeeChange(value) {
      if (value.date != "" && value.fee_id != "") {
        var param = {
          date: timestamp10(value.date), // 时间  10位时间戳
          branch_id: this.formdata.share[0].share_branch_id, // 区域id
          check_fee_type: this.formdata.reimburse_type, // 类型
          check_fee_id: value.fee_id, // 该类型的id
        };
        var fress_name = this.travelExpenseList.find(
          (item) => item.id == value.fee_id
        );
        this.regional_monthly_Obj(param, fress_name);
      }
    },
    handleFeeChangeType(value) {
      if (
        value.date != "" &&
        value.fee_id != "" &&
        this.AuditDetails.is_current_user_can_approve == 1
      ) {
        var param = {
          date: timestamp10(value.date), // 时间  10位时间戳
          branch_id: this.formdata.share[0].share_branch_id, // 区域id
          check_fee_type: this.formdata.reimburse_type, // 类型
          check_fee_id: value.fee_id, // 该类型的id
          apply_id: this.formdata.id, // 申请id      给审核人提示时需要填
          scene_type: "2", // 报销申请2   其它付款申请为4    给审核人提示时需要填
        };
        var fress_name = this.travelExpenseList.find(
          (item) => item.id == value.fee_id
        );
        this.regional_monthly_Obj_Data(param, fress_name);
      }
    },
    regional_monthly_Obj(param, fress_name) {
      regional_monthly_payment_check(param).then((res) => {
        var datatime = param.date * 1000;
        const formattedDate = this.formatDateFromTimestamp(datatime);
        if (res.data == 1) {
          this.$notify({
            // title: `${formattedDate}${fress_name.name}已经申请过付款，请核实申请是否有误`,
            // duration: 0,
            // showClose: false,
            // offset: 30
            dangerouslyUseHTMLString: true,
            message: `<div style="display:flex;">
                                <i class="el-icon-warning" style="font-size:20px;color:red;margin:0px 6px 0px 0px"></i>
                                <div >${formattedDate}${fress_name.name}已经申请过付款，请核实申请是否有误<div>
                                </div>`,
            duration: 0,
            showClose: false,
            offset: 30,
            customClass: "customClass_list",
          });
        } else {
        }
      });
    },
    regional_monthly_Obj_Data(param, fress_name) {
      regional_monthly_payment_check(param).then((res) => {
        var datatime = param.date * 1000;
        const formattedDate = this.formatDateFromTimestamp(datatime);
        if (res.data == 1) {
          this.$notify({
            // title: `${formattedDate}${fress_name.name}已经申请过付款，请和申请人了解具体情况后再审批`,
            // duration: 0,
            // showClose: false,
            // offset: 30
            dangerouslyUseHTMLString: true,
            message: `<div style="display:flex;">
                                <i class="el-icon-warning" style="font-size:20px;color:red;margin:0px 6px 0px 0px"></i>
                                <div >${formattedDate}${fress_name.name}已经申请过付款，请和申请人了解具体情况后再审批<div>
                                </div>`,
            duration: 0,
            showClose: false,
            offset: 30,
            customClass: "customClass_list_tow",
          });
        } else {
        }
      });
    },
    formatDateFromTimestamp(timestamp) {
      const date = new Date(timestamp);
      const year = date.getFullYear();
      const month = String(date.getMonth() + 1).padStart(2, "0");
      const day = String(date.getDate()).padStart(2, "0");
      // 格式为：年-月-日
      return `${year}年${month}月`;
    },
    reapplyPay() {
      if (this.formdata.expenditure_list != null) {
        this.formdata.expenditure_list.forEach((item) => {
          item.date = timestamp10(item.date) + "";
        });
      }
      var carr_all_list = [];
      this.spanValcheckedRows.filter((itme) => {
        carr_all_list.push(itme.carry_all_data[0]);
      });
      var result = [];
      var obj = {};
      for (var i = 0; i < carr_all_list.length; i++) {
        if (!obj[carr_all_list[i].id]) {
          result.push(carr_all_list[i]);
          obj[carr_all_list[i].id] = true;
        }
      }
      if (this.formdata.share_type == 0) {
        let total = 0;
        for (let i = 0; i < this.formdata.share.length; i++) {
          total += Number(this.formdata.share[i]["share_content"]);
        }
        var allcollectMoney = this.collectMoeny == "" ? 0 : this.collectMoeny;
        if (allcollectMoney != 0) {
          if (
            total == allcollectMoney &&
            this.formdata.charge_off_money * 1 <= this.collectMoeny * 1
          ) {
            var param = {
              ...this.formdata,
              id: "",
              relation_id: this.formdata.relation_id + "",
              share_department_id: this.formdata.share_department_id + "",
              company_invoice_body_id:
                this.formdata.company_invoice_body_id + "",
              payee: this.formdata.payee,
              is_initiate_audi: 0 + "", //保存的时候0 发起审批1
              expenditure_list: this.formdata.expenditure_list,
              carry_all_data: result,
            };
            reimburseCreate(param).then((res) => {
              if (res.code == "10000") {
                this.open3("再次申请报销成功", "success");
                this.presercancel();
              }
            });
          } else {
            if (this.formdata.charge_off_money * 1 > this.collectMoeny * 1) {
              this.open3("使用的冲抵备用金不能超过报销金额", "warning");
            } else {
              this.open3("分摊总金额需等于付款金额", "warning");
            }
          }
        }
      } else if (this.formdata.share_type == 1) {
        let total = 0;
        for (let i = 0; i < this.formdata.share.length; i++) {
          total += Number(this.formdata.share[i]["share_content"]);
        }
        if (
          total == "100" &&
          this.formdata.charge_off_money * 1 <= this.collectMoeny * 1
        ) {
          var param = {
            ...this.formdata,
            id: "",
            relation_id: this.formdata.relation_id + "",
            share_department_id: this.formdata.share_department_id + "",
            company_invoice_body_id: this.formdata.company_invoice_body_id + "",
            payee: this.formdata.payee,
            is_initiate_audi: 0 + "", //保存的时候0 发起审批1
            expenditure_list: this.formdata.expenditure_list,
            carry_all_data: result,
          };
          reimburseCreate(param).then((res) => {
            if (res.code == "10000") {
              this.open3("再次申请报销成功", "success");
              this.presercancel();
            }
          });
        } else {
          if (this.formdata.charge_off_money * 1 > this.collectMoeny * 1) {
            this.open3("使用的冲抵备用金不能超过报销金额", "warning");
          } else {
            this.open3("分摊比例不能超过100%", "warning");
          }
        }
      }
    },
    handleClick(value) {
      var param = {
        relation_id: value.relation_id,
        node_type: value.node_type,
      };
      reqCheckWaybillFees(param).then((res) => {
        if (res.code == 10000) {
          if (res.data) {
            this.carryInfo = res.data;
            this.adjustWaybillFee = res.data.relation_info;
            this.adjustWaybillFeeOriginal = JSON.parse(
              JSON.stringify(res.data.relation_info)
            );
            this.tableTabe = this.adjustWaybillFee[0].node_type;
            this.changeWaybillFees = true;
          }
        }
      });
    },
    async saveWaybillFees() {
      if (this.reasonList) {
        const newdata = this.compareArrays(
          this.adjustWaybillFee,
          this.adjustWaybillFeeOriginal
        );
        console.log(this.carryInfo, "this.carryInfothis.carryInfo");
        let result3 = await modifyCheckWaybillFees({
          //修改运单金额
          // account_id: String(this.carryInfo.account_id),
          relation_id: String(this.carryInfo.relation_id),
          relation_expense: newdata,
          reason: this.reasonList,
          node_type: this.carryInfo.relation_info[0].node_type,
          type: "1",
        });
        if (result3.code === 10000) {
          this.$message({
            type: "success",
            message: "调整成功",
          });
          this.changeWaybillFees = false;
          this.queryDateSee();
        }
      } else {
        this.$message({
          type: "warning",
          message: "请输入调整原因",
        });
      }
    },
    async getWebsiteListDQFn() {
      let result = await reqWebsiteList({ type: "3" });
      this.websiteListDQ = result.data || [];
    },
    async getThermosphereType() {
      let result2 = await getTransportsList({ is_all: false });
      this.transportsType = result2.data.data;
    },
    claimpayment(val) {
      var param = {
        relation_id: val.id,
        // waybill_id: val.waybill_id,
        // waybill_no: val.waybill_no,
        node_type: val.node_type, //1揽收 2干线 3配送 4回单 5回箱
      };
      finance_reimburse_apply_check_carry(param).then((res) => {
        this.$message({
          message: res.data,
          type: "warning",
        });
      });
    },
    findWaybillById(data, targetId) {
      for (let i = 0; i < data.length; i++) {
        if (data[i].waybill_id === targetId) {
          return data[i];
        }
      }
      return null; // 如果未找到匹配的数据，返回 null 或其他适当的值
    },
    searchCustomerList(query) {
      if (query !== "") {
        var param = {
          body_belong: "3",
          invoice_body_name: query,
        };
      }
      finance_invoice_book_options(param).then((res) => {
        this.clientList = res.data;
        this.formdata.payee = query;
      });
    },
    selectedCustomer(value) {
      var clientdata = this.clientList.find((item) => item.id == value);
      if (clientdata) {
        this.formdata.payee = clientdata.invoice_body_name;
        this.formdata.receive_bank = clientdata.bank_of_deposit;
        this.formdata.receive_account = clientdata.account_no;
      }
    },
    // 运单诊断
    waybilldiagno() {
      if (this.queryDate.waybill_no) {
        this.centerDialogwayBill = true;
        this.node_type_id = "";
        this.cause_failure = "";
      } else {
        this.$message({
          message: "请输入运单号",
          type: "warning",
        });
      }
    },
    //  查询节点信息
    centerDiaBill() {
      var param = {
        waybill_no: this.queryDate.waybill_no,
        node_type: this.node_type_id,
      };
      finance_reimburse_apply_check_carry(param).then((res) => {
        if (res.code == 10000) {
          this.cause_failure = res.data;
        }
      });
    },
    exportFirst() {
      var param = {
        id: this.formdata.id, // 报销id
      };
      reimburse_apply_carry_export(param).then((res) => {
        this.reqUrl = "https://" + res.data;
        window.open(this.reqUrl);
      });
    },
    // },
    isRowDisabled(row, index) {
      return row.status == 0;
    },
    // 打开诊断列表页
    diagnosis() {
      this.diaouterVisible = true;
    },
    diaouterVisibleclose() {
      this.diaouterVisible = false;
    },
    async getCustomerList() {
      let result3 = await customerPeople({
        name: "",
        is_send: "1",
        is_receive: "",
      });
      if (result3.code === 10000) {
        this.customerList = result3.data;
      }
    },
    async getWebsiteList() {
      let result = await branchList({ branch_type: "3" });
      this.websiteList = result.data;
    },
    //
    siteListFn() {
      PagewebsiteList("0").then((res) => {
        var res = res.data;
        this.originListData = res;
      });
    },
    async getWebsiteListDQFn() {
      let result = await reqWebsiteList({ type: "3" });
      this.websiteListDQ = result.data || [];
    },
    async getThermosphereType() {
      let result2 = await getTransportsList({ is_all: false });
      this.transportsType = result2.data.data;
    },
    claimpayment(val) {
      var param = {
        relation_id: val.relation_id,
        // waybill_id: val.waybill_id,
        // waybill_no: val.waybill_no,
        node_type: val.node_type, //1揽收 2干线 3配送 4回单 5回箱
      };
      finance_reimburse_apply_check_carry(param).then((res) => {
        this.$message({
          message: res.data,
          type: "warning",
        });
      });
    },
    findWaybillById(data, targetId) {
      for (let i = 0; i < data.length; i++) {
        if (data[i].waybill_id === targetId) {
          return data[i];
        }
      }
      return null; // 如果未找到匹配的数据，返回 null 或其他适当的值
    },
    searchCustomerList(query) {
      if (query !== "") {
        var param = {
          body_belong: "3",
          invoice_body_name: query,
        };
      }
      finance_invoice_book_options(param).then((res) => {
        this.clientList = res.data;
        this.formdata.payee = query;
      });
    },
    selectedCustomer(value) {
      var clientdata = this.clientList.find((item) => item.id == value);
      if (clientdata) {
        this.formdata.payee = clientdata.invoice_body_name;
        this.formdata.receive_bank = clientdata.bank_of_deposit;
        this.formdata.receive_account = clientdata.account_no;
      }
    },
    // 运单诊断
    waybilldiagno() {
      if (this.queryDate.waybill_no) {
        this.centerDialogwayBill = true;
        this.node_type_id = "";
        this.cause_failure = "";
      } else {
        this.$message({
          message: "请输入运单号",
          type: "warning",
        });
      }
    },
    //  查询节点信息
    centerDiaBill() {
      var param = {
        waybill_no: this.queryDate.waybill_no,
        node_type: this.node_type_id,
      };
      finance_reimburse_apply_check_carry(param).then((res) => {
        if (res.code == 10000) {
          this.cause_failure = res.data;
        }
      });
    },
    beforeDestroy() {
      this.$notify.closeAll();
    },
    selectChange(rows, row) {
      this.chooseData = row.time_id;
      this.selectedTure = rows.length && rows.indexOf(row) !== -1;
    },
    removeChooseData(allData, newData, datature) {
      if (datature == false) {
        for (let i = allData.length - 1; i >= 0; i--) {
          if (newData.includes(allData[i])) {
            allData.splice(i, 1);
          }
        }
      } else {
      }

      return allData;
    },
    removeElementsFromArray(mainArray, elementsToRemove) {
      for (let i = mainArray.length - 1; i >= 0; i--) {
        if (elementsToRemove.includes(mainArray[i] * 1)) {
          mainArray.splice(i, 1);
        }
      }
      return mainArray;
    },
    compareArrays(arr1, arr2) {
      const result = [];
      for (let i = 0; i < arr1.length; i++) {
        const obj1 = arr1[i];
        const obj2 = arr2[i];
        for (const key in obj1) {
          if (obj1.hasOwnProperty(key) && obj2.hasOwnProperty(key)) {
            if (obj1[key] !== obj2[key]) {
              result.push(obj1);
              break;
            }
          }
        }
      }
      return result;
    },
    // 时间校验
    Timeverify(value, statuse) {
      //  statuse 当 1 是开始 时间 2 是结束时间
      if (value != null) {
        if (value.length > 0) {
          if (statuse == 1) {
            return parseInt(value[0] / 1000) + "";
          } else if (statuse == 2) {
            return parseInt(value[1] / 1000) + "";
          }
        } else {
          return "";
        }
      } else {
        return "";
      }
    },
    PassAuditturn() {
      this.dialogturn = true;
    },
    showMsgfromChild(data) {
      console.log(data, " this.$emit('listenToChildEvent',this.datalist)");

      if (data.resstatus == 1) {
        this.record_process_detailObj();
        this.$router.go(-1);
      } else {
      }
      this.dialogturn = false;
    },
    customDiagosis() {
        this.customerData = {
          customer_id:this.formdata.relation_id,
          search_time:this.formdata.expenditure_list[0].date,
          diagnosis:true 
        }
      },
      fatherMethodHandle() {
        this.customerData = {
          customer_id:this.formdata.relation_id,
          search_time:this.formdata.expenditure_list[0].date,
          diagnosis:false
        }
      }
  },
};
</script>
<style scoped lang="less">
.el-table__body {
  width: 100%;
  table-layout: fixed !important;
}
/deep/ .uploadList .el-upload--picture-card,
/deep/ .uploadList .el-upload-list__item {
  width: 98px;
  height: 98px;
  line-height: 100px;
}

/deep/ .receiptManageadd_form_details .el-form-item--mini .el-form-item__label {
  line-height: 6px;
}

.receiptManageadd_form_details .row_height_of {
  height: initial;
  font-size: 15px;
}

/deep/ .receiptManageadd_form_details .el-form-item__content {
  font-weight: bold;
}

/deep/
  .receiptManageadd_form_creation
  .el-form-item--mini
  .el-form-item__label {
  line-height: 6px;
}

.charging_rules {
  /* padding: 10px;
    margin-top: 5px;
    margin-left: 5px; */
  /* background-color: #fff; */
}

.footerType {
  position: fixed;
  background: #ffffff;
  margin: 10px 10px 10px 10px;
  padding: 10px;
  border-radius: 10px;
  width: calc(100% - 225px);
  z-index: 100;
  bottom: -1.5%;
}

.rule_title {
  display: flex;
  align-items: center;
  padding-bottom: 18px;
  padding-top: 8px;
  font-size: 14px;
  font-weight: bold;
  justify-content: space-between;

  .title-l {
    display: flex;
    align-items: center;
  }

  .icon_left {
    display: inline-block;
    width: 6px;
    height: 16px;
    background: #f1a357;
    margin-right: 6px;
  }
}

.remodername .number {
  height: 20px;
  display: block;
}

.remodername:hover .number {
  display: none;
}

.remodername .remodercenter {
  display: none;
  color: #161414;
}

.remodername:hover .remodercenter {
  height: 20px;
  display: block;
  color: #262424;
  text-align: center;
  font-size: 10px;
  padding: 5px 0px 0px 0px;
  /* margin-top: 5px; */
}

.row_height_of {
  height: 90px;
}
</style>
<style>
.customClass_list {
  width: 500px !important;
  background: #fff1f0;
  border: 1px solid #ffbdb9;
  height: 61px;
}

.customClass_list_tow {
  width: 600px !important;
  background: #fff1f0;
  border: 1px solid #ffbdb9;
  height: 61px;
}
</style>